Device, Method, and Graphical User Interface for Managing Electronic Communications

ABSTRACT

An electronic device: displays a conversation view of a plurality of messages within a first pane of a messaging application, where the conversation view includes a first message region of a portion of a first message and a second message region of a portion of a second message; and detects a user input selecting the first message region within the conversation view. In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies first input criteria, the device displays one or more affordances provided to perform corresponding actions on the first message. In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies second input criteria, the device replaces display of the conversation view with a message view that corresponds to the first message.

TECHNICAL FIELD

This relates generally to electronic devices with touch-sensitivesurfaces, including but not limited to electronic devices withtouch-sensitive surfaces that manage electronic communications.

BACKGROUND

The use of touch-sensitive surfaces as input devices for computers andother electronic computing devices has increased significantly in recentyears. Example touch-sensitive surfaces include touchpads andtouch-screen displays. Such surfaces are widely used to manipulate userinterface objects on a display.

Example manipulations include adjusting the position and/or size of oneor more user interface objects or activating buttons or openingfiles/applications represented by user interface objects, as well asassociating metadata with one or more user interface objects orotherwise manipulating user interfaces. Example user interface objectsinclude digital images, video, text, icons, control elements such asbuttons and other graphics. A user will, in some circumstances, need toperform such manipulations on user interface objects in a filemanagement program (e.g., Finder from Apple Inc. of Cupertino, Calif.),an image management application (e.g., Aperture, iPhoto, Photos fromApple Inc. of Cupertino, Calif.), a digital content (e.g., videos andmusic) management application (e.g., iTunes from Apple Inc. ofCupertino, Calif.), a drawing application, a presentation application(e.g., Keynote from Apple Inc. of Cupertino, Calif.), a word processingapplication (e.g., Pages from Apple Inc. of Cupertino, Calif.), awebsite creation application (e.g., iWeb from Apple Inc. of Cupertino,Calif.), a disk authoring application (e.g., iDVD from Apple Inc. ofCupertino, Calif.), or a spreadsheet application (e.g., Numbers fromApple Inc. of Cupertino, Calif.).

But methods for performing these manipulations are cumbersome andinefficient. For example, using a sequence of mouse based inputs toselect one or more user interface objects and perform one or moreactions on the selected user interface objects is tedious and creates asignificant cognitive burden on a user. In addition, these methods takelonger than necessary, thereby wasting energy. This latter considerationis particularly important in battery-operated devices.

SUMMARY

Accordingly, there is a need for electronic devices with faster, moreefficient methods and interfaces for managing electronic communications.Such methods and interfaces optionally complement or replaceconventional methods for managing electronic communications. Suchmethods and interfaces reduce the cognitive burden on a user and producea more efficient human-machine interface. For battery-operated devices,such methods and interfaces conserve power and increase the time betweenbattery charges.

The above deficiencies and other problems associated with userinterfaces for electronic devices with touch-sensitive surfaces arereduced or eliminated by the disclosed devices. In some embodiments, thedevice is a desktop computer. In some embodiments, the device isportable (e.g., a notebook computer, tablet computer, or handhelddevice). In some embodiments, the device has a touchpad. In someembodiments, the device has a touch-sensitive display (also known as a“touch screen” or “touch-screen display”). In some embodiments, thedevice has a graphical user interface (GUI), one or more processors,memory and one or more modules, programs or sets of instructions storedin the memory for performing multiple functions. In some embodiments,the user interacts with the GUI primarily through stylus and/or fingercontacts and gestures on the touch-sensitive surface. In someembodiments, the functions optionally include image editing, drawing,presenting, word processing, website creating, disk authoring,spreadsheet making, game playing, telephoning, video conferencing,e-mailing, instant messaging, workout support, digital photographing,digital videoing, web browsing, digital music playing, and/or digitalvideo playing. Executable instructions for performing these functionsare, optionally, included in a non-transitory computer readable storagemedium or other computer program product configured for execution by oneor more processors.

In accordance with some embodiments, a method is performed at a devicewith one or more processors, non-transitory memory, a display, and aninput device. The method includes displaying, on the display, an inboxview of a messaging application that includes a plurality of rowsrepresenting electronic communications, the plurality of rows includinga first row representing a first plurality of messages that satisfy oneor more conversation criteria that indicate that each of the firstplurality of messages are a part of a same respective conversation, anda second row representing a second plurality of messages that satisfy afirst category criterion but are not part of a same conversation. Themethod also includes detecting an input, via the input device,corresponding to selection of a respective row from among the pluralityof rows in the inbox view. In response to detecting the input, and inaccordance with a determination that the respective row corresponds tothe first row, the method further includes displaying, on the display,additional information corresponding to two or more messages from theconversation of related messages that are represented by the first row.In response to detecting the input, and in accordance with adetermination that the respective row corresponds to the second row, themethod further includes displaying, on the display, additionalinformation corresponding to two or more messages from among theplurality of messages that are represented by the second row, includinga first message and a second message that both satisfy the firstcategory criterion but not part of a same conversation.

In accordance with some embodiments, a method is performed at a devicewith one or more processors, non-transitory memory, a display, and aninput device. The method includes concurrently displaying, on thedisplay, a plurality of representations of electronic communicationsassociated with a first grouping and a filter affordance, where thefilter affordance corresponds to a set of one or more filter criteria.While concurrently displaying the plurality of representations ofelectronic communications and the filter affordance, the method alsoincludes detecting a selection input, via the input device, thatcorresponds to selection of the filter affordance. In response todetecting the selection input, and in accordance with a determinationthat the selection input corresponds to a first input type, the methodfurther includes: ceasing to display a first set of representations ofelectronic communications from among the plurality of representations ofelectronic communications associated with the first grouping that do notmatch the set of one or more filter criteria; displaying a second set ofrepresentations of electronic communications from among the plurality ofrepresentations of electronic communications associated with the firstgrouping that match the set of one or more filter criteria; anddisplaying an indication of the set of one or more filter criteria thathave been applied to the electronic communications associated with thefirst grouping.

In accordance with some embodiments, a method is performed at a devicewith one or more processors, non-transitory memory, a display, and aninput device. The method includes: displaying, on the display, aconversation view of a plurality of messages within a first pane of amessaging application, where the conversation view includes a firstmessage region of a portion of a first message of the plurality ofmessages and a second message region of a portion of a second message ofthe plurality of messages; and detecting a user input, via the inputdevice, that corresponds to selecting the first message region withinthe conversation view. In response to detecting the user input selectingthe first message region, and in accordance with a determination thatthe user input satisfies a first set of input criteria, the method alsoincludes displaying, on the display, one or more affordances provided toperform corresponding actions on the first message. In response todetecting the user input selecting the first message region, and inaccordance with a determination that the user input satisfies a secondset of input criteria, the method further includes replacing display ofthe conversation view with a message view that corresponds to the firstmessage.

In accordance with some embodiments, an electronic device includes adisplay unit configured to display a user interface, one or more inputunits configured to received user inputs, and a processing unit coupledwith the display unit and the one or more input units. The processingunit is configured enable display of, on the display unit, an inbox viewof a messaging application that includes a plurality of rowsrepresenting electronic communications, the plurality of rows includinga first row representing a first plurality of messages that satisfy oneor more conversation criteria that indicate that each of the firstplurality of messages are a part of a same respective conversation, anda second row representing a second plurality of messages that satisfy afirst category criterion but are not part of a same conversation. Theprocessing unit is also configured to detect an input, via the one ormore input units, corresponding to selection of a respective row fromamong the plurality of rows in the inbox view. In response to detectingthe input, the processing unit 1008 is further configured to enabledisplay of, on the display unit, additional information corresponding totwo or more messages from the conversation of related messages that arerepresented by the first row in accordance with a determination that therespective row corresponds to the first row. In response to detectingthe input, the processing unit is further configured to enable displayof, on the display unit, additional information corresponding to two ormore messages from among the plurality of messages that are representedby the second row, including a first message and a second message thatboth satisfy the first category criterion but not part of a sameconversation in accordance with a determination that the respective rowcorresponds to the second row.

In accordance with some embodiments, an electronic device includes adisplay unit configured to display a user interface, one or more inputunits configured to received user inputs, and a processing unit coupledwith the display unit and the one or more input units. The processingunit is configured to enable concurrent display of, on the display unit,a plurality of representations of electronic communications, and afilter affordance, where the filter affordance corresponds to a set ofone or more filter criteria. The processing unit is also configured todetect a selection input, via the one or more input units, thatcorresponds to selection of the filter affordance while concurrentlydisplaying the plurality of representations of electronic communicationsand the filter affordance. In response to detecting the selection input,and in accordance with a determination that the selection inputcorresponds to a first input type, the processing unit is furtherconfigured to: cease display of, on the display unit, a first set ofrepresentations of electronic communications from among the plurality ofrepresentations of electronic communications associated with the firstgrouping that do not match the set of one or more filter criteria;enable display, on the display unit, a second set of representations ofelectronic communications from among the plurality of representations ofelectronic communications associated with the first grouping that matchthe set of one or more filter criteria; and display of, on the displayunit, an indication of the set of one or more filter criteria that havebeen applied to the electronic communications associated with the firstgrouping.

In accordance with some embodiments, an electronic device includes adisplay unit configured to display a user interface, one or more inputunits configured to received user inputs, and a processing unit coupledwith the display unit and the one or more input units. The processingunit is configured to: enable display of, on the display unit, aconversation view of a plurality of messages within a first pane of amessaging application, where the conversation view includes a firstmessage region of a portion of a first message of the plurality ofmessages and a second message region of a portion of a second message ofthe plurality of messages; and detect a user input, via the one or moreinput units, that corresponds to selecting the first message regionwithin the conversation view. In response to detecting the user inputselecting the first message region, and in accordance with adetermination that the user input satisfies a first set of inputcriteria, the processing unit is further configured to enable displayof, on the display unit, displaying one or more affordances provided toperform corresponding actions on the first message. In response todetecting the user input selecting the first message region, and inaccordance with a determination that the user input satisfies a secondset of input criteria, the processing unit is further configured toreplace display of the conversation view with a message view thatcorresponds to the first message.

In accordance with some embodiments, an electronic device includes adisplay, an input device, one or more processors, non-transitory memory,and one or more programs; the one or more programs are stored in thenon-transitory memory and configured to be executed by the one or moreprocessors and the one or more programs include instructions forperforming or causing performance of the operations of any of themethods described herein. In accordance with some embodiments, anon-transitory computer readable storage medium has stored thereininstructions which when executed by one or more processors of anelectronic device with a display and an input device, cause the deviceto perform or cause performance of the operations of any of the methodsdescribed herein. In accordance with some embodiments, a graphical userinterface on an electronic device with a display, an input device, amemory, and one or more processors to execute one or more programsstored in the non-transitory memory includes one or more of the elementsdisplayed in any of the methods described above, which are updated inresponse to inputs, as described in any of the methods described herein.In accordance with some embodiments, an electronic device includes: adisplay, an input device; and means for performing or causingperformance of the operations of any of the methods described herein. Inaccordance with some embodiments, an information processing apparatus,for use in an electronic device with a display and an input device,includes means for performing or causing performance of the operationsof any of the methods described herein.

Thus, electronic devices with displays, touch-sensitive surfaces andoptionally one or more sensors to detect intensity of contacts with thetouch-sensitive surface are provided with faster, more efficient methodsand interfaces for managing electronic communications, therebyincreasing the effectiveness, efficiency, and user satisfaction withsuch devices. Such methods and interfaces may complement or replaceconventional methods for managing electronic communications.

BRIEF DESCRIPTION OF THE DRAWINGS

For a better understanding of the various described embodiments,reference should be made to the Description of Embodiments below, inconjunction with the following drawings in which like reference numeralsrefer to corresponding parts throughout the figures.

FIG. 1A is a block diagram illustrating a portable multifunction devicewith a touch-sensitive display in accordance with some embodiments.

FIG. 1B is a block diagram illustrating example components for eventhandling in accordance with some embodiments.

FIG. 2 illustrates a portable multifunction device having a touch screenin accordance with some embodiments.

FIG. 3 is a block diagram of an example multifunction device with adisplay and a touch-sensitive surface in accordance with someembodiments.

FIG. 4A illustrates an example user interface for a menu of applicationson a portable multifunction device in accordance with some embodiments.

FIG. 4B illustrates an example user interface for a multifunction devicewith a touch-sensitive surface that is separate from the display inaccordance with some embodiments.

FIGS. 5A-5R illustrate example user interfaces for managing electroniccommunications in accordance with some embodiments.

FIGS. 6A-6F illustrate example user interfaces for managing electroniccommunications in accordance with some embodiments.

FIGS. 7A-7P illustrate example user interfaces for displayingaffordances for performing corresponding actions within a conversationview in accordance with some embodiments.

FIGS. 8A-8C illustrate a flow diagram of a method of bundling electroniccommunications in accordance with some embodiments.

FIGS. 9A-9C illustrate a flow diagram of a method of filteringelectronic communications in accordance with some embodiments.

FIGS. 10A-10C illustrate a flow diagram of a method of displayingaffordances for performing corresponding actions within a conversationview in accordance with some embodiments.

FIGS. 11-13 are functional block diagrams of an electronic device inaccordance with some embodiments.

DESCRIPTION OF EMBODIMENTS

The use of electronic devices with touch-based user interfaces (e.g.,devices such as the iPhone®, iPod Touch®, iPad®, MacBook®, and iMac®devices from Apple Inc. of Cupertino, Calif.) has increasedsignificantly in recent years. These devices use touch-sensitivesurfaces, such as a touch screen display or a touch pad, as the maininput for manipulating user interface objects on a display and/orcontrolling the device. These devices may also have contact intensitysensor for determining a force or pressure of contacts with thetouch-sensitive surfaces.

Described below are devices and methods that enable messages that arenot part of a conversation to be grouped into a bundle that isrepresented as a row in an inbox view. Also, described below are devicesand methods that provide an affordance to quickly toggle a filter formessages in an inbox view. Further, described below are devices andmethods that enable a user to access a set of affordances for performingactions on a message within a conversation view.

Below, FIGS. 1A-1B, 2-3, and 4A-4B provide a description of exampledevices. FIGS. 5A-5R, 6A-6F, and 7A-7P illustrate example userinterfaces for managing electronic communications. FIGS. 8A-8Cillustrate a flow diagram of a method of bundling electroniccommunications. FIGS. 9A-9C illustrate a flow diagram of a method offiltering electronic communications. FIGS. 10A-10C illustrate a flowdiagram of a method of displaying affordances for performingcorresponding actions within a conversation view. The user interfaces inFIGS. 5A-5R and 6A-6F are used to illustrate the processes in FIGS.8A-8C, 9A-9C, and 10A-10C.

Example Devices

Reference will now be made in detail to embodiments, examples of whichare illustrated in the accompanying drawings. In the following detaileddescription, numerous specific details are set forth in order to providea thorough understanding of the various described embodiments. However,it will be apparent to one of ordinary skill in the art that the variousdescribed embodiments may be practiced without these specific details.In other instances, well-known methods, procedures, components,circuits, and networks have not been described in detail so as not tounnecessarily obscure aspects of the embodiments.

It will also be understood that, although the terms first, second, etc.are, in some instances, used herein to describe various elements, theseelements should not be limited by these terms. These terms are only usedto distinguish one element from another. For example, a first contactcould be termed a second contact, and, similarly, a second contact couldbe termed a first contact, without departing from the scope of thevarious described embodiments. The first contact and the second contactare both contacts, but they are not the same contact, unless the contextclearly indicates otherwise.

The terminology used in the description of the various describedembodiments herein is for the purpose of describing particularembodiments only and is not intended to be limiting. As used in thedescription of the various described embodiments and the appendedclaims, the singular forms “a,” “an,” and “the” are intended to includethe plural forms as well, unless the context clearly indicatesotherwise. It will also be understood that the term “and/or” as usedherein refers to and encompasses any and all possible combinations ofone or more of the associated listed items. It will be furtherunderstood that the terms “includes,” “including,” “comprises,” and/or“comprising,” when used in this specification, specify the presence ofstated features, integers, steps, operations, elements, and/orcomponents, but do not preclude the presence or addition of one or moreother features, integers, steps, operations, elements, components,and/or groups thereof.

As used herein, the term “if” is, optionally, construed to mean “when”or “upon” or “in response to determining” or “in response to detecting,”depending on the context. Similarly, the phrase “if it is determined” or“if [a stated condition or event] is detected” is, optionally, construedto mean “upon determining” or “in response to determining” or “upondetecting [the stated condition or event]” or “in response to detecting[the stated condition or event],” depending on the context.

Embodiments of electronic devices, user interfaces for such devices, andassociated processes for using such devices are described. In someembodiments, the device is a portable communications device, such as amobile telephone, that also contains other functions, such as PDA and/ormusic player functions. Example embodiments of portable multifunctiondevices include, without limitation, the iPhone®, iPod Touch®, and iPad®devices from Apple Inc. of Cupertino, Calif. Other portable electronicdevices, such as laptops or tablet computers with touch-sensitivesurfaces (e.g., touch-screen displays and/or touchpads), are,optionally, used. It should also be understood that, in someembodiments, the device is not a portable communications device, but isa desktop computer with a touch-sensitive surface (e.g., a touch-screendisplay and/or a touchpad).

In the discussion that follows, an electronic device that includes adisplay and a touch-sensitive surface is described. It should beunderstood, however, that the electronic device optionally includes oneor more other physical user-interface devices, such as a physicalkeyboard, a mouse and/or a joystick.

The device typically supports a variety of applications, such as one ormore of the following: a drawing application, a presentationapplication, a word processing application, a website creationapplication, a disk authoring application, a spreadsheet application, agaming application, a telephone application, a video conferencingapplication, an e-mail application, an instant messaging application, aworkout support application, a photo management application, a digitalcamera application, a digital video camera application, a web browsingapplication, a digital music player application, and/or a digital videoplayer application.

The various applications that are executed on the device optionally useat least one common physical user-interface device, such as thetouch-sensitive surface. One or more functions of the touch-sensitivesurface as well as corresponding information displayed on the deviceare, optionally, adjusted and/or varied from one application to the nextand/or within a respective application. In this way, a common physicalarchitecture (such as the touch-sensitive surface) of the deviceoptionally supports the variety of applications with user interfacesthat are intuitive and transparent to the user.

Attention is now directed toward embodiments of portable devices withtouch-sensitive displays. FIG. 1A is a block diagram illustratingportable multifunction device 100 with touch-sensitive display system112 in accordance with some embodiments. Touch-sensitive display system112 is sometimes called a “touch screen” for convenience, and issometimes simply called a touch-sensitive display. Device 100 includesmemory 102 (which optionally includes one or more computer readablestorage mediums), memory controller 122, one or more processing units(CPUs) 120, peripherals interface 118, RF circuitry 108, audio circuitry110, speaker 111, microphone 113, input/output (I/O) subsystem 106,other input or control devices 116, and external port 124. Device 100optionally includes one or more optical sensors 164. Device 100optionally includes one or more intensity sensors 165 for detectingintensity of contacts on device 100 (e.g., a touch-sensitive surfacesuch as touch-sensitive display system 112 of device 100). Device 100optionally includes one or more tactile output generators 163 forgenerating tactile outputs on device 100 (e.g., generating tactileoutputs on a touch-sensitive surface such as touch-sensitive displaysystem 112 of device 100 or touchpad 355 of device 300). Thesecomponents optionally communicate over one or more communication busesor signal lines 103.

As used in the specification and claims, the term “tactile output”refers to physical displacement of a device relative to a previousposition of the device, physical displacement of a component (e.g., atouch-sensitive surface) of a device relative to another component(e.g., housing) of the device, or displacement of the component relativeto a center of mass of the device that will be detected by a user withthe user's sense of touch. For example, in situations where the deviceor the component of the device is in contact with a surface of a userthat is sensitive to touch (e.g., a finger, palm, or other part of auser's hand), the tactile output generated by the physical displacementwill be interpreted by the user as a tactile sensation corresponding toa perceived change in physical characteristics of the device or thecomponent of the device. For example, movement of a touch-sensitivesurface (e.g., a touch-sensitive display or trackpad) is, optionally,interpreted by the user as a “down click” or “up click” of a physicalactuator button. In some cases, a user will feel a tactile sensationsuch as an “down click” or “up click” even when there is no movement ofa physical actuator button associated with the touch-sensitive surfacethat is physically pressed (e.g., displaced) by the user's movements. Asanother example, movement of the touch-sensitive surface is, optionally,interpreted or sensed by the user as “roughness” of the touch-sensitivesurface, even when there is no change in smoothness of thetouch-sensitive surface. While such interpretations of touch by a userwill be subject to the individualized sensory perceptions of the user,there are many sensory perceptions of touch that are common to a largemajority of users. Thus, when a tactile output is described ascorresponding to a particular sensory perception of a user (e.g., an “upclick,” a “down click,” “roughness”), unless otherwise stated, thegenerated tactile output corresponds to physical displacement of thedevice or a component thereof that will generate the described sensoryperception for a typical (or average) user.

It should be appreciated that device 100 is only one example of aportable multifunction device, and that device 100 optionally has moreor fewer components than shown, optionally combines two or morecomponents, or optionally has a different configuration or arrangementof the components. The various components shown in FIG. 1A areimplemented in hardware, software, firmware, or a combination thereof,including one or more signal processing and/or application specificintegrated circuits.

Memory 102 optionally includes high-speed random access memory andoptionally also includes non-volatile memory, such as one or moremagnetic disk storage devices, flash memory devices, or othernon-volatile solid-state memory devices. Access to memory 102 by othercomponents of device 100, such as CPU(s) 120 and the peripheralsinterface 118, is, optionally, controlled by memory controller 122.

Peripherals interface 118 can be used to couple input and outputperipherals of the device to CPU(s) 120 and memory 102. The one or moreprocessors 120 run or execute various software programs and/or sets ofinstructions stored in memory 102 to perform various functions fordevice 100 and to process data.

In some embodiments, peripherals interface 118, CPU(s) 120, and memorycontroller 122 are, optionally, implemented on a single chip, such aschip 104. In some other embodiments, they are, optionally, implementedon separate chips.

RF (radio frequency) circuitry 108 receives and sends RF signals, alsocalled electromagnetic signals. RF circuitry 108 converts electricalsignals to/from electromagnetic signals and communicates withcommunications networks and other communications devices via theelectromagnetic signals. RF circuitry 108 optionally includes well-knowncircuitry for performing these functions, including but not limited toan antenna system, an RF transceiver, one or more amplifiers, a tuner,one or more oscillators, a digital signal processor, a CODEC chipset, asubscriber identity module (SIM) card, memory, and so forth. RFcircuitry 108 optionally communicates with networks, such as theInternet, also referred to as the World Wide Web (WWW), an intranetand/or a wireless network, such as a cellular telephone network, awireless local area network (LAN) and/or a metropolitan area network(MAN), and other devices by wireless communication. The wirelesscommunication optionally uses any of a plurality of communicationsstandards, protocols and technologies, including but not limited toGlobal System for Mobile Communications (GSM), Enhanced Data GSMEnvironment (EDGE), high-speed downlink packet access (HSDPA),high-speed uplink packet access (HSUPA), Evolution, Data-Only (EV-DO),HSPA, HSPA+, Dual-Cell HSPA (DC-HSPDA), long term evolution (LTE), nearfield communication (NFC), wideband code division multiple access(W-CDMA), code division multiple access (CDMA), time division multipleaccess (TDMA), Bluetooth, Wireless Fidelity (Wi-Fi) (e.g., IEEE 802.11a,IEEE 802.11ac, IEEE 802.11ax, IEEE 802.11b, IEEE 802.11g and/or IEEE802.11n), voice over Internet Protocol (VoIP), Wi-MAX, a protocol fore-mail (e.g., Internet message access protocol (IMAP) and/or post officeprotocol (POP)), instant messaging (e.g., extensible messaging andpresence protocol (XMPP), Session Initiation Protocol for InstantMessaging and Presence Leveraging Extensions (SIMPLE), Instant Messagingand Presence Service (IMPS)), and/or Short Message Service (SMS), or anyother suitable communication protocol, including communication protocolsnot yet developed as of the filing date of this document.

Audio circuitry 110, speaker 111, and microphone 113 provide an audiointerface between a user and device 100. Audio circuitry 110 receivesaudio data from peripherals interface 118, converts the audio data to anelectrical signal, and transmits the electrical signal to speaker 111.Speaker 111 converts the electrical signal to human-audible sound waves.Audio circuitry 110 also receives electrical signals converted bymicrophone 113 from sound waves. Audio circuitry 110 converts theelectrical signal to audio data and transmits the audio data toperipherals interface 118 for processing. Audio data is, optionally,retrieved from and/or transmitted to memory 102 and/or RF circuitry 108by peripherals interface 118. In some embodiments, audio circuitry 110also includes a headset jack (e.g., 212, FIG. 2). The headset jackprovides an interface between audio circuitry 110 and removable audioinput/output peripherals, such as output-only headphones or a headsetwith both output (e.g., a headphone for one or both ears) and input(e.g., a microphone).

I/O subsystem 106 couples input/output peripherals on device 100, suchas touch-sensitive display system 112 and other input or control devices116, with peripherals interface 118. I/O subsystem 106 optionallyincludes display controller 156, optical sensor controller 158,intensity sensor controller 159, haptic feedback controller 161, and oneor more input controllers 160 for other input or control devices. Theone or more input controllers 160 receive/send electrical signalsfrom/to other input or control devices 116. The other input or controldevices 116 optionally include physical buttons (e.g., push buttons,rocker buttons, etc.), dials, slider switches, joysticks, click wheels,and so forth. In some alternate embodiments, input controller(s) 160are, optionally, coupled with any (or none) of the following: akeyboard, infrared port, USB port, stylus, and/or a pointer device suchas a mouse. The one or more buttons (e.g., 208, FIG. 2) optionallyinclude an up/down button for volume control of speaker 111 and/ormicrophone 113. The one or more buttons optionally include a push button(e.g., 206, FIG. 2).

Touch-sensitive display system 112 provides an input interface and anoutput interface between the device and a user. Display controller 156receives and/or sends electrical signals from/to touch-sensitive displaysystem 112. Touch-sensitive display system 112 displays visual output tothe user. The visual output optionally includes graphics, text, icons,video, and any combination thereof (collectively termed “graphics”). Insome embodiments, some or all of the visual output corresponds touser-interface objects.

Touch-sensitive display system 112 has a touch-sensitive surface, sensoror set of sensors that accepts input from the user based onhaptic/tactile contact. Touch-sensitive display system 112 and displaycontroller 156 (along with any associated modules and/or sets ofinstructions in memory 102) detect contact (and any movement or breakingof the contact) on touch-sensitive display system 112 and converts thedetected contact into interaction with user-interface objects (e.g., oneor more soft keys, icons, web pages or images) that are displayed ontouch-sensitive display system 112. In an example embodiment, a point ofcontact between touch-sensitive display system 112 and the usercorresponds to a finger of the user or a stylus.

Touch-sensitive display system 112 optionally uses LCD (liquid crystaldisplay) technology, LPD (light emitting polymer display) technology, orLED (light emitting diode) technology, although other displaytechnologies are used in other embodiments. Touch-sensitive displaysystem 112 and display controller 156 optionally detect contact and anymovement or breaking thereof using any of a plurality of touch sensingtechnologies now known or later developed, including but not limited tocapacitive, resistive, infrared, and surface acoustic wave technologies,as well as other proximity sensor arrays or other elements fordetermining one or more points of contact with touch-sensitive displaysystem 112. In an example embodiment, projected mutual capacitancesensing technology is used, such as that found in the iPhone®, iPodTouch®, and iPad® from Apple Inc. of Cupertino, Calif.

Touch-sensitive display system 112 optionally has a video resolution inexcess of 100 dpi. In some embodiments, the touch screen videoresolution is in excess of 400 dpi (e.g., 500 dpi, 800 dpi, or greater).The user optionally makes contact with touch-sensitive display system112 using any suitable object or appendage, such as a stylus, a finger,and so forth. In some embodiments, the user interface is designed towork with finger-based contacts and gestures, which can be less precisethan stylus-based input due to the larger area of contact of a finger onthe touch screen. In some embodiments, the device translates the roughfinger-based input into a precise pointer/cursor position or command forperforming the actions desired by the user.

In some embodiments, in addition to the touch screen, device 100optionally includes a touchpad (not shown) for activating ordeactivating particular functions. In some embodiments, the touchpad isa touch-sensitive area of the device that, unlike the touch screen, doesnot display visual output. The touchpad is, optionally, atouch-sensitive surface that is separate from touch-sensitive displaysystem 112 or an extension of the touch-sensitive surface formed by thetouch screen.

Device 100 also includes power system 162 for powering the variouscomponents. Power system 162 optionally includes a power managementsystem, one or more power sources (e.g., battery, alternating current(AC)), a recharging system, a power failure detection circuit, a powerconverter or inverter, a power status indicator (e.g., a light-emittingdiode (LED)) and any other components associated with the generation,management and distribution of power in portable devices.

Device 100 optionally also includes one or more optical sensors 164.FIG. 1A shows an optical sensor coupled with optical sensor controller158 in I/O subsystem 106. Optical sensor(s) 164 optionally includecharge-coupled device (CCD) or complementary metal-oxide semiconductor(CMOS) phototransistors. Optical sensor(s) 164 receive light from theenvironment, projected through one or more lens, and converts the lightto data representing an image. In conjunction with imaging module 143(also called a camera module), optical sensor(s) 164 optionally capturestill images and/or video. In some embodiments, an optical sensor islocated on the back of device 100, opposite touch-sensitive displaysystem 112 on the front of the device, so that the touch screen isenabled for use as a viewfinder for still and/or video imageacquisition. In some embodiments, another optical sensor is located onthe front of the device so that the user's image is obtained (e.g., forselfies, for videoconferencing while the user views the other videoconference participants on the touch screen, etc.).

Device 100 optionally also includes one or more contact intensitysensors 165. FIG. 1A shows a contact intensity sensor coupled withintensity sensor controller 159 in I/O subsystem 106. Contact intensitysensor(s) 165 optionally include one or more piezoresistive straingauges, capacitive force sensors, electric force sensors, piezoelectricforce sensors, optical force sensors, capacitive touch-sensitivesurfaces, or other intensity sensors (e.g., sensors used to measure theforce (or pressure) of a contact on a touch-sensitive surface). Contactintensity sensor(s) 165 receive contact intensity information (e.g.,pressure information or a proxy for pressure information) from theenvironment. In some embodiments, at least one contact intensity sensoris collocated with, or proximate to, a touch-sensitive surface (e.g.,touch-sensitive display system 112). In some embodiments, at least onecontact intensity sensor is located on the back of device 100, oppositetouch-screen display system 112 which is located on the front of device100.

Device 100 optionally also includes one or more proximity sensors 166.FIG. 1A shows proximity sensor 166 coupled with peripherals interface118. Alternately, proximity sensor 166 is coupled with input controller160 in I/O subsystem 106. In some embodiments, the proximity sensorturns off and disables touch-sensitive display system 112 when themultifunction device is placed near the user's ear (e.g., when the useris making a phone call).

Device 100 optionally also includes one or more tactile outputgenerators 163. FIG. 1A shows a tactile output generator coupled withhaptic feedback controller 161 in I/O subsystem 106. Tactile outputgenerator(s) 163 optionally include one or more electroacoustic devicessuch as speakers or other audio components and/or electromechanicaldevices that convert energy into linear motion such as a motor,solenoid, electroactive polymer, piezoelectric actuator, electrostaticactuator, or other tactile output generating component (e.g., acomponent that converts electrical signals into tactile outputs on thedevice). Tactile output generator(s) 163 receive tactile feedbackgeneration instructions from haptic feedback module 133 and generatestactile outputs on device 100 that are capable of being sensed by a userof device 100. In some embodiments, at least one tactile outputgenerator is collocated with, or proximate to, a touch-sensitive surface(e.g., touch-sensitive display system 112) and, optionally, generates atactile output by moving the touch-sensitive surface vertically (e.g.,in/out of a surface of device 100) or laterally (e.g., back and forth inthe same plane as a surface of device 100). In some embodiments, atleast one tactile output generator sensor is located on the back ofdevice 100, opposite touch-sensitive display system 112, which islocated on the front of device 100.

Device 100 optionally also includes one or more accelerometers 167,gyroscopes 168, and/or magnetometers 169 (e.g., as part of an inertialmeasurement unit (IMU)) for obtaining information concerning theposition (e.g., attitude) of the device. FIG. 1A shows sensors 167, 168,and 169 coupled with peripherals interface 118. Alternately, sensors167, 168, and 169 are, optionally, coupled with an input controller 160in I/O subsystem 106. In some embodiments, information is displayed onthe touch-screen display in a portrait view or a landscape view based onan analysis of data received from the one or more accelerometers. Device100 optionally includes a GPS (or GLONASS or other global navigationsystem) receiver (not shown) for obtaining information concerning thelocation of device 100.

In some embodiments, the software components stored in memory 102include operating system 126, communication module (or set ofinstructions) 128, contact/motion module (or set of instructions) 130,graphics module (or set of instructions) 132, haptic feedback module (orset of instructions) 133, text input module (or set of instructions)134, Global Positioning System (GPS) module (or set of instructions)135, and applications (or sets of instructions) 136. Furthermore, insome embodiments, memory 102 stores device/global internal state 157, asshown in FIGS. 1A and 3. Device/global internal state 157 includes oneor more of: active application state, indicating which applications, ifany, are currently active; display state, indicating what applications,views or other information occupy various regions of touch-sensitivedisplay system 112; sensor state, including information obtained fromthe device's various sensors and other input or control devices 116; andlocation and/or positional information concerning the device's locationand/or attitude.

Operating system 126 (e.g., iOS, Darwin, RTXC, LINUX, UNIX, OS X,WINDOWS, or an embedded operating system such as VxWorks) includesvarious software components and/or drivers for controlling and managinggeneral system tasks (e.g., memory management, storage device control,power management, etc.) and facilitates communication between varioushardware and software components.

Communication module 128 facilitates communication with other devicesover one or more external ports 124 and also includes various softwarecomponents for handling data received by RF circuitry 108 and/orexternal port 124. External port 124 (e.g., Universal Serial Bus (USB),FIREWIRE, etc.) is adapted for coupling directly to other devices orindirectly over a network (e.g., the Internet, wireless LAN, etc.). Insome embodiments, the external port is a multi-pin (e.g., 30-pin)connector that is the same as, or similar to and/or compatible with the30-pin connector used in some iPhone®, iPod Touch®, and iPad® devicesfrom Apple Inc. of Cupertino, Calif. In some embodiments, the externalport is a Lightning connector that is the same as, or similar to and/orcompatible with the Lightning connector used in some iPhone®, iPodTouch®, and iPad® devices from Apple Inc. of Cupertino, Calif.

Contact/motion module 130 optionally detects contact withtouch-sensitive display system 112 (in conjunction with displaycontroller 156) and other touch-sensitive devices (e.g., a touchpad orphysical click wheel). Contact/motion module 130 includes softwarecomponents for performing various operations related to detection ofcontact (e.g., by a finger or by a stylus), such as determining ifcontact has occurred (e.g., detecting a finger-down event), determiningan intensity of the contact (e.g., the force or pressure of the contactor a substitute for the force or pressure of the contact), determiningif there is movement of the contact and tracking the movement across thetouch-sensitive surface (e.g., detecting one or more finger-draggingevents), and determining if the contact has ceased (e.g., detecting afinger-up event or a break in contact). Contact/motion module 130receives contact data from the touch-sensitive surface. Determiningmovement of the point of contact, which is represented by a series ofcontact data, optionally includes determining speed (magnitude),velocity (magnitude and direction), and/or an acceleration (a change inmagnitude and/or direction) of the point of contact. These operationsare, optionally, applied to single contacts (e.g., one finger contactsor stylus contacts) or to multiple simultaneous contacts (e.g.,“multitouch”/multiple finger contacts and/or stylus contacts). In someembodiments, contact/motion module 130 and display controller 156 detectcontact on a touchpad.

Contact/motion module 130 optionally detects a gesture input by a user.Different gestures on the touch-sensitive surface have different contactpatterns (e.g., different motions, timings, and/or intensities ofdetected contacts). Thus, a gesture is, optionally, detected bydetecting a particular contact pattern. For example, detecting a fingertap gesture includes detecting a finger-down event followed by detectinga finger-up (lift off) event at the same position (or substantially thesame position) as the finger-down event (e.g., at the position of anicon). As another example, detecting a finger swipe gesture on thetouch-sensitive surface includes detecting a finger-down event followedby detecting one or more finger-dragging events, and subsequentlyfollowed by detecting a finger-up (lift off) event. Similarly, tap,swipe, drag, and other gestures are optionally detected for a stylus bydetecting a particular contact pattern for the stylus.

Graphics module 132 includes various known software components forrendering and displaying graphics on touch-sensitive display system 112or other display, including components for changing the visual impact(e.g., brightness, transparency, saturation, contrast or other visualproperty) of graphics that are displayed. As used herein, the term“graphics” includes any object that can be displayed to a user,including without limitation text, web pages, icons (such asuser-interface objects including soft keys), digital images, videos,animations and the like.

In some embodiments, graphics module 132 stores data representinggraphics to be used. Each graphic is, optionally, assigned acorresponding code. Graphics module 132 receives, from applicationsetc., one or more codes specifying graphics to be displayed along with,if necessary, coordinate data and other graphic property data, and thengenerates screen image data to output to display controller 156.

Haptic feedback module 133 includes various software components forgenerating instructions used by tactile output generator(s) 163 toproduce tactile outputs at one or more locations on device 100 inresponse to user interactions with device 100.

Text input module 134, which is, optionally, a component of graphicsmodule 132, provides soft keyboards for entering text in variousapplications (e.g., contacts 137, e-mail 140, IM 141, browser 147, andany other application that needs text input).

GPS module 135 determines the location of the device and provides thisinformation for use in various applications (e.g., to telephone 138 foruse in location-based dialing, to camera 143 as picture/video metadata,and to applications that provide location-based services such as weatherwidgets, local yellow page widgets, and map/navigation widgets).

Applications 136 optionally include the following modules (or sets ofinstructions), or a subset or superset thereof:

-   -   contacts module 137 (sometimes called an address book or contact        list);    -   telephone module 138;    -   video conferencing module 139;    -   e-mail client module 140;    -   instant messaging (IM) module 141;    -   workout support module 142;    -   camera module 143 for still and/or video images;    -   image management module 144;    -   browser module 147;    -   calendar module 148;    -   widget modules 149, which optionally include one or more of:        weather widget 149-1, stocks widget 149-2, calculator widget        149-3, alarm clock widget 149-4, dictionary widget 149-5, and        other widgets obtained by the user, as well as user-created        widgets 149-6;    -   widget creator module 150 for making user-created widgets 149-6;    -   search module 151;    -   video and music player module 152, which is, optionally, made up        of a video player module and a music player module;    -   notes module 153;    -   map module 154; and/or    -   online video module 155.

Examples of other applications 136 that are, optionally, stored inmemory 102 include other word processing applications, other imageediting applications, drawing applications, presentation applications,JAVA-enabled applications, encryption, digital rights management, voicerecognition, and voice replication.

In conjunction with touch-sensitive display system 112, displaycontroller 156, contact module 130, graphics module 132, and text inputmodule 134, contacts module 137 includes executable instructions tomanage an address book or contact list (e.g., stored in applicationinternal state 192 of contacts module 137 in memory 102 or memory 370),including: adding name(s) to the address book; deleting name(s) from theaddress book; associating telephone number(s), e-mail address(es),physical address(es) or other information with a name; associating animage with a name; categorizing and sorting names; providing telephonenumbers and/or e-mail addresses to initiate and/or facilitatecommunications by telephone 138, video conference 139, e-mail 140, or IM141; and so forth.

In conjunction with RF circuitry 108, audio circuitry 110, speaker 111,microphone 113, touch-sensitive display system 112, display controller156, contact module 130, graphics module 132, and text input module 134,telephone module 138 includes executable instructions to enter asequence of characters corresponding to a telephone number, access oneor more telephone numbers in address book 137, modify a telephone numberthat has been entered, dial a respective telephone number, conduct aconversation and disconnect or hang up when the conversation iscompleted. As noted above, the wireless communication optionally usesany of a plurality of communications standards, protocols andtechnologies.

In conjunction with RF circuitry 108, audio circuitry 110, speaker 111,microphone 113, touch-sensitive display system 112, display controller156, optical sensor(s) 164, optical sensor controller 158, contactmodule 130, graphics module 132, text input module 134, contact list137, and telephone module 138, videoconferencing module 139 includesexecutable instructions to initiate, conduct, and terminate a videoconference between a user and one or more other participants inaccordance with user instructions.

In conjunction with RF circuitry 108, touch-sensitive display system112, display controller 156, contact module 130, graphics module 132,and text input module 134, e-mail client module 140 includes executableinstructions to create, send, receive, and manage e-mail in response touser instructions. In conjunction with image management module 144,e-mail client module 140 makes it very easy to create and send e-mailswith still or video images taken with camera module 143.

In conjunction with RF circuitry 108, touch-sensitive display system112, display controller 156, contact module 130, graphics module 132,and text input module 134, the instant messaging module 141 includesexecutable instructions to enter a sequence of characters correspondingto an instant message, to modify previously entered characters, totransmit a respective instant message (for example, using a ShortMessage Service (SMS) or Multimedia Message Service (MMS) protocol fortelephony-based instant messages or using XMPP, SIMPLE, Apple PushNotification Service (APNs) or IMPS for Internet-based instantmessages), to receive instant messages and to view received instantmessages. In some embodiments, transmitted and/or received instantmessages optionally include graphics, photos, audio files, video filesand/or other attachments as are supported in a MMS and/or an EnhancedMessaging Service (EMS). As used herein, “instant messaging” refers toboth telephony-based messages (e.g., messages sent using SMS or MMS) andInternet-based messages (e.g., messages sent using XMPP, SIMPLE, APNs,or IMPS).

In conjunction with RF circuitry 108, touch-sensitive display system112, display controller 156, contact module 130, graphics module 132,text input module 134, GPS module 135, map module 154, and music playermodule 146, workout support module 142 includes executable instructionsto create workouts (e.g., with time, distance, and/or calorie burninggoals); communicate with workout sensors (in sports devices and smartwatches); receive workout sensor data; calibrate sensors used to monitora workout; select and play music for a workout; and display, store andtransmit workout data.

In conjunction with touch-sensitive display system 112, displaycontroller 156, optical sensor(s) 164, optical sensor controller 158,contact module 130, graphics module 132, and image management module144, camera module 143 includes executable instructions to capture stillimages or video (including a video stream) and store them into memory102, modify characteristics of a still image or video, and/or delete astill image or video from memory 102.

In conjunction with touch-sensitive display system 112, displaycontroller 156, contact module 130, graphics module 132, text inputmodule 134, and camera module 143, image management module 144 includesexecutable instructions to arrange, modify (e.g., edit), or otherwisemanipulate, label, delete, present (e.g., in a digital slide show oralbum), and store still and/or video images.

In conjunction with RF circuitry 108, touch-sensitive display system112, display system controller 156, contact module 130, graphics module132, and text input module 134, browser module 147 includes executableinstructions to browse the Internet in accordance with userinstructions, including searching, linking to, receiving, and displayingweb pages or portions thereof, as well as attachments and other fileslinked to web pages.

In conjunction with RF circuitry 108, touch-sensitive display system112, display system controller 156, contact module 130, graphics module132, text input module 134, e-mail client module 140, and browser module147, calendar module 148 includes executable instructions to create,display, modify, and store calendars and data associated with calendars(e.g., calendar entries, to do lists, etc.) in accordance with userinstructions.

In conjunction with RF circuitry 108, touch-sensitive display system112, display system controller 156, contact module 130, graphics module132, text input module 134, and browser module 147, widget modules 149are mini-applications that are, optionally, downloaded and used by auser (e.g., weather widget 149-1, stocks widget 149-2, calculator widget149-3, alarm clock widget 149-4, and dictionary widget 149-5) or createdby the user (e.g., user-created widget 149-6). In some embodiments, awidget includes an HTML (Hypertext Markup Language) file, a CSS(Cascading Style Sheets) file, and a JavaScript file. In someembodiments, a widget includes an XML (Extensible Markup Language) fileand a JavaScript file (e.g., Yahoo! Widgets).

In conjunction with RF circuitry 108, touch-sensitive display system112, display system controller 156, contact module 130, graphics module132, text input module 134, and browser module 147, the widget creatormodule 150 includes executable instructions to create widgets (e.g.,turning a user-specified portion of a web page into a widget).

In conjunction with touch-sensitive display system 112, display systemcontroller 156, contact module 130, graphics module 132, and text inputmodule 134, search module 151 includes executable instructions to searchfor text, music, sound, image, video, and/or other files in memory 102that match one or more search criteria (e.g., one or more user-specifiedsearch terms) in accordance with user instructions.

In conjunction with touch-sensitive display system 112, display systemcontroller 156, contact module 130, graphics module 132, audio circuitry110, speaker 111, RF circuitry 108, and browser module 147, video andmusic player module 152 includes executable instructions that allow theuser to download and play back recorded music and other sound filesstored in one or more file formats, such as MP3 or AAC files, andexecutable instructions to display, present or otherwise play backvideos (e.g., on touch-sensitive display system 112, or on an externaldisplay connected wirelessly or via external port 124). In someembodiments, device 100 optionally includes the functionality of an MP3player, such as an iPod (trademark of Apple Inc.).

In conjunction with touch-sensitive display system 112, displaycontroller 156, contact module 130, graphics module 132, and text inputmodule 134, notes module 153 includes executable instructions to createand manage notes, to do lists, and the like in accordance with userinstructions.

In conjunction with RF circuitry 108, touch-sensitive display system112, display system controller 156, contact module 130, graphics module132, text input module 134, GPS module 135, and browser module 147, mapmodule 154 includes executable instructions to receive, display, modify,and store maps and data associated with maps (e.g., driving directions;data on stores and other points of interest at or near a particularlocation; and other location-based data) in accordance with userinstructions.

In conjunction with touch-sensitive display system 112, display systemcontroller 156, contact module 130, graphics module 132, audio circuitry110, speaker 111, RF circuitry 108, text input module 134, e-mail clientmodule 140, and browser module 147, online video module 155 includesexecutable instructions that allow the user to access, browse, receive(e.g., by streaming and/or download), play back (e.g., on the touchscreen 112, or on an external display connected wirelessly or viaexternal port 124), send an e-mail with a link to a particular onlinevideo, and otherwise manage online videos in one or more file formats,such as H.264. In some embodiments, instant messaging module 141, ratherthan e-mail client module 140, is used to send a link to a particularonline video.

Each of the above identified modules and applications correspond to aset of executable instructions for performing one or more functionsdescribed above and the methods described in this application (e.g., thecomputer-implemented methods and other information processing methodsdescribed herein). These modules (i.e., sets of instructions) need notbe implemented as separate software programs, procedures or modules, andthus various subsets of these modules are, optionally, combined orotherwise re-arranged in various embodiments. In some embodiments,memory 102 optionally stores a subset of the modules and data structuresidentified above. Furthermore, memory 102 optionally stores additionalmodules and data structures not described above.

In some embodiments, device 100 is a device where operation of apredefined set of functions on the device is performed exclusivelythrough a touch screen and/or a touchpad. By using a touch screen and/ora touchpad as the primary input control device for operation of device100, the number of physical input control devices (such as push buttons,dials, and the like) on device 100 is, optionally, reduced.

The predefined set of functions that are performed exclusively through atouch screen and/or a touchpad optionally include navigation betweenuser interfaces. In some embodiments, the touchpad, when touched by theuser, navigates device 100 to a main, home, or root menu from any userinterface that is displayed on device 100. In such embodiments, a “menubutton” is implemented using a touchpad. In some other embodiments, themenu button is a physical push button or other physical input controldevice instead of a touchpad.

FIG. 1B is a block diagram illustrating example components for eventhandling in accordance with some embodiments. In some embodiments,memory 102 (in FIG. 1A) or 370 (FIG. 3) includes event sorter 170 (e.g.,in operating system 126) and a respective application 136-1 (e.g., anyof the aforementioned applications 136, 137-155, 380-390).

Event sorter 170 receives event information and determines theapplication 136-1 and application view 191 of application 136-1 to whichto deliver the event information. Event sorter 170 includes eventmonitor 171 and event dispatcher module 174. In some embodiments,application 136-1 includes application internal state 192, whichindicates the current application view(s) displayed on touch-sensitivedisplay system 112 when the application is active or executing. In someembodiments, device/global internal state 157 is used by event sorter170 to determine which application(s) is (are) currently active, andapplication internal state 192 is used by event sorter 170 to determineapplication views 191 to which to deliver event information.

In some embodiments, application internal state 192 includes additionalinformation, such as one or more of: resume information to be used whenapplication 136-1 resumes execution, user interface state informationthat indicates information being displayed or that is ready for displayby application 136-1, a state queue for enabling the user to go back toa prior state or view of application 136-1, and a redo/undo queue ofprevious actions taken by the user.

Event monitor 171 receives event information from peripherals interface118. Event information includes information about a sub-event (e.g., auser touch on touch-sensitive display system 112, as part of amulti-touch gesture). Peripherals interface 118 transmits information itreceives from I/O subsystem 106 or a sensor, such as proximity sensor166, accelerometer(s) 167, gyroscope(s) 168, magnetometer(s) 169, and/ormicrophone 113 (through audio circuitry 110). Information thatperipherals interface 118 receives from I/O subsystem 106 includesinformation from touch-sensitive display system 112 or a touch-sensitivesurface.

In some embodiments, event monitor 171 sends requests to the peripheralsinterface 118 at predetermined intervals. In response, peripheralsinterface 118 transmits event information. In other embodiments,peripheral interface 118 transmits event information only when there isa significant event (e.g., receiving an input above a predeterminednoise threshold and/or for more than a predetermined duration).

In some embodiments, event sorter 170 also includes a hit viewdetermination module 172 and/or an active event recognizer determinationmodule 173.

Hit view determination module 172 provides software procedures fordetermining where a sub-event has taken place within one or more views,when touch-sensitive display system 112 displays more than one view.Views are made up of controls and other elements that a user can see onthe display.

Another aspect of the user interface associated with an application is aset of views, sometimes herein called application views or userinterface windows, in which information is displayed and touch-basedgestures occur. The application views (of a respective application) inwhich a touch is detected optionally correspond to programmatic levelswithin a programmatic or view hierarchy of the application. For example,the lowest level view in which a touch is detected is, optionally,called the hit view, and the set of events that are recognized as properinputs are, optionally, determined based, at least in part, on the hitview of the initial touch that begins a touch-based gesture.

Hit view determination module 172 receives information related tosub-events of a touch-based gesture. When an application has multipleviews organized in a hierarchy, hit view determination module 172identifies a hit view as the lowest view in the hierarchy which shouldhandle the sub-event. In most circumstances, the hit view is the lowestlevel view in which an initiating sub-event occurs (i.e., the firstsub-event in the sequence of sub-events that form an event or potentialevent). Once the hit view is identified by the hit view determinationmodule, the hit view typically receives all sub-events related to thesame touch or input source for which it was identified as the hit view.

Active event recognizer determination module 173 determines which viewor views within a view hierarchy should receive a particular sequence ofsub-events. In some embodiments, active event recognizer determinationmodule 173 determines that only the hit view should receive a particularsequence of sub-events. In other embodiments, active event recognizerdetermination module 173 determines that all views that include thephysical location of a sub-event are actively involved views, andtherefore determines that all actively involved views should receive aparticular sequence of sub-events. In other embodiments, even if touchsub-events were entirely confined to the area associated with oneparticular view, views higher in the hierarchy would still remain asactively involved views.

Event dispatcher module 174 dispatches the event information to an eventrecognizer (e.g., event recognizer 180). In embodiments including activeevent recognizer determination module 173, event dispatcher module 174delivers the event information to an event recognizer determined byactive event recognizer determination module 173. In some embodiments,event dispatcher module 174 stores in an event queue the eventinformation, which is retrieved by a respective event receiver module182.

In some embodiments, operating system 126 includes event sorter 170.Alternatively, application 136-1 includes event sorter 170. In yet otherembodiments, event sorter 170 is a stand-alone module, or a part ofanother module stored in memory 102, such as contact/motion module 130.

In some embodiments, application 136-1 includes a plurality of eventhandlers 190 and one or more application views 191, each of whichincludes instructions for handling touch events that occur within arespective view of the application's user interface. Each applicationview 191 of the application 136-1 includes one or more event recognizers180. Typically, a respective application view 191 includes a pluralityof event recognizers 180. In other embodiments, one or more of eventrecognizers 180 are part of a separate module, such as a user interfacekit (not shown) or a higher level object from which application 136-1inherits methods and other properties. In some embodiments, a respectiveevent handler 190 includes one or more of: data updater 176, objectupdater 177, GUI updater 178, and/or event data 179 received from eventsorter 170. Event handler 190 optionally utilizes or calls data updater176, object updater 177 or GUI updater 178 to update the applicationinternal state 192. Alternatively, one or more of the application views191 includes one or more respective event handlers 190. Also, in someembodiments, one or more of data updater 176, object updater 177, andGUI updater 178 are included in a respective application view 191.

A respective event recognizer 180 receives event information (e.g.,event data 179) from event sorter 170, and identifies an event from theevent information. Event recognizer 180 includes event receiver 182 andevent comparator 184. In some embodiments, event recognizer 180 alsoincludes at least a subset of: metadata 183, and event deliveryinstructions 188 (which optionally include sub-event deliveryinstructions).

Event receiver 182 receives event information from event sorter 170. Theevent information includes information about a sub-event, for example, atouch or a touch movement. Depending on the sub-event, the eventinformation also includes additional information, such as location ofthe sub-event. When the sub-event concerns motion of a touch, the eventinformation optionally also includes speed and direction of thesub-event. In some embodiments, events include rotation of the devicefrom one orientation to another (e.g., from a portrait orientation to alandscape orientation, or vice versa), and the event informationincludes corresponding information about the current orientation (alsocalled device attitude) of the device.

Event comparator 184 compares the event information to predefined eventor sub-event definitions and, based on the comparison, determines anevent or sub-event, or determines or updates the state of an event orsub-event. In some embodiments, event comparator 184 includes eventdefinitions 186. Event definitions 186 contain definitions of events(e.g., predefined sequences of sub-events), for example, event 1(187-1), event 2 (187-2), and others. In some embodiments, sub-events inan event 187 include, for example, touch begin, touch end, touchmovement, touch cancellation, and multiple touching. In one example, thedefinition for event 1 (187-1) is a double tap on a displayed object.The double tap, for example, comprises a first touch (touch begin) onthe displayed object for a predetermined phase, a first lift-off (touchend) for a predetermined phase, a second touch (touch begin) on thedisplayed object for a predetermined phase, and a second lift-off (touchend) for a predetermined phase. In another example, the definition forevent 2 (187-2) is a dragging on a displayed object. The dragging, forexample, comprises a touch (or contact) on the displayed object for apredetermined phase, a movement of the touch across touch-sensitivedisplay system 112, and lift-off of the touch (touch end). In someembodiments, the event also includes information for one or moreassociated event handlers 190.

In some embodiments, event definition 187 includes a definition of anevent for a respective user-interface object. In some embodiments, eventcomparator 184 performs a hit test to determine which user-interfaceobject is associated with a sub-event. For example, in an applicationview in which three user-interface objects are displayed ontouch-sensitive display system 112, when a touch is detected ontouch-sensitive display system 112, event comparator 184 performs a hittest to determine which of the three user-interface objects isassociated with the touch (sub-event). If each displayed object isassociated with a respective event handler 190, the event comparatoruses the result of the hit test to determine which event handler 190should be activated. For example, event comparator 184 selects an eventhandler associated with the sub-event and the object triggering the hittest.

In some embodiments, the definition for a respective event 187 alsoincludes delayed actions that delay delivery of the event informationuntil after it has been determined whether the sequence of sub-eventsdoes or does not correspond to the event recognizer's event type.

When a respective event recognizer 180 determines that the series ofsub-events do not match any of the events in event definitions 186, therespective event recognizer 180 enters an event impossible, eventfailed, or event ended state, after which it disregards subsequentsub-events of the touch-based gesture. In this situation, other eventrecognizers, if any, that remain active for the hit view continue totrack and process sub-events of an ongoing touch-based gesture.

In some embodiments, a respective event recognizer 180 includes metadata183 with configurable properties, flags, and/or lists that indicate howthe event delivery system should perform sub-event delivery to activelyinvolved event recognizers. In some embodiments, metadata 183 includesconfigurable properties, flags, and/or lists that indicate how eventrecognizers interact, or are enabled to interact, with one another. Insome embodiments, metadata 183 includes configurable properties, flags,and/or lists that indicate whether sub-events are delivered to varyinglevels in the view or programmatic hierarchy.

In some embodiments, a respective event recognizer 180 activates eventhandler 190 associated with an event when one or more particularsub-events of an event are recognized. In some embodiments, a respectiveevent recognizer 180 delivers event information associated with theevent to event handler 190. Activating an event handler 190 is distinctfrom sending (and deferred sending) sub-events to a respective hit view.In some embodiments, event recognizer 180 throws a flag associated withthe recognized event, and event handler 190 associated with the flagcatches the flag and performs a predefined process.

In some embodiments, event delivery instructions 188 include sub-eventdelivery instructions that deliver event information about a sub-eventwithout activating an event handler. Instead, the sub-event deliveryinstructions deliver event information to event handlers associated withthe series of sub-events or to actively involved views. Event handlersassociated with the series of sub-events or with actively involved viewsreceive the event information and perform a predetermined process.

In some embodiments, data updater 176 creates and updates data used inapplication 136-1. For example, data updater 176 updates the telephonenumber used in contacts module 137, or stores a video file used in videoplayer module 145. In some embodiments, object updater 177 creates andupdates objects used in application 136-1. For example, object updater176 creates a new user-interface object or updates the position of auser-interface object. GUI updater 178 updates the GUI. For example, GUIupdater 178 prepares display information and sends it to graphics module132 for display on a touch-sensitive display.

In some embodiments, event handler(s) 190 includes or has access to dataupdater 176, object updater 177, and GUI updater 178. In someembodiments, data updater 176, object updater 177, and GUI updater 178are included in a single module of a respective application 136-1 orapplication view 191. In other embodiments, they are included in two ormore software modules.

It shall be understood that the foregoing discussion regarding eventhandling of user touches on touch-sensitive displays also applies toother forms of user inputs to operate multifunction devices 100 withinput-devices, not all of which are initiated on touch screens. Forexample, mouse movement and mouse button presses, optionally coordinatedwith single or multiple keyboard presses or holds; contact movementssuch as taps, drags, scrolls, etc., on touch-pads; pen stylus inputs;movement of the device; oral instructions; detected eye movements;biometric inputs; and/or any combination thereof are optionally utilizedas inputs corresponding to sub-events which define an event to berecognized.

FIG. 2 illustrates a portable multifunction device 100 having a touchscreen (e.g., touch-sensitive display system 112, FIG. 1A) in accordancewith some embodiments. The touch screen optionally displays one or moregraphics within user interface (UI) 200. In this embodiment, as well asothers described below, a user is enabled to select one or more of thegraphics by making a gesture on the graphics, for example, with one ormore fingers 202 (not drawn to scale in the figure) or one or morestyluses 203 (not drawn to scale in the figure). In some embodiments,selection of one or more graphics occurs when the user breaks contactwith the one or more graphics. In some embodiments, the gestureoptionally includes one or more taps, one or more swipes (from left toright, right to left, upward and/or downward) and/or a rolling of afinger (from right to left, left to right, upward and/or downward) thathas made contact with device 100. In some implementations orcircumstances, inadvertent contact with a graphic does not select thegraphic. For example, a swipe gesture that sweeps over an applicationicon optionally does not select the corresponding application when thegesture corresponding to selection is a tap.

Device 100 optionally also includes one or more physical buttons, suchas “home” or menu button 204. As described previously, menu button 204is, optionally, used to navigate to any application 136 in a set ofapplications that are, optionally executed on device 100. Alternatively,in some embodiments, the menu button is implemented as a soft key in aGUI displayed on the touch-screen display.

In some embodiments, device 100 includes the touch-screen display, menubutton 204, push button 206 for powering the device on/off and lockingthe device, volume adjustment button(s) 208, Subscriber Identity Module(SIM) card slot 210, head set jack 212, and docking/charging externalport 124. Push button 206 is, optionally, used to turn the power on/offon the device by depressing the button and holding the button in thedepressed state for a predefined time interval; to lock the device bydepressing the button and releasing the button before the predefinedtime interval has elapsed; and/or to unlock the device or initiate anunlock process. In some embodiments, device 100 also accepts verbalinput for activation or deactivation of some functions throughmicrophone 113. Device 100 also, optionally, includes one or morecontact intensity sensors 165 for detecting intensity of contacts ontouch-sensitive display system 112 and/or one or more tactile outputgenerators 163 for generating tactile outputs for a user of device 100.

FIG. 3 is a block diagram of an example multifunction device with adisplay and a touch-sensitive surface in accordance with someembodiments. Device 300 need not be portable. In some embodiments,device 300 is a laptop computer, a desktop computer, a tablet computer,a multimedia player device, a navigation device, an educational device(such as a child's learning toy), a gaming system, or a control device(e.g., a home or industrial controller). Device 300 typically includesone or more processing units (CPU's) 310, one or more network or othercommunications interfaces 360, memory 370, and one or more communicationbuses 320 for interconnecting these components. Communication buses 320optionally include circuitry (sometimes called a chipset) thatinterconnects and controls communications between system components.Device 300 includes input/output (I/O) interface 330 comprising display340, which is typically a touch-screen display. I/O interface 330 alsooptionally includes a keyboard and/or mouse (or other pointing device)350 and touchpad 355, tactile output generator 357 for generatingtactile outputs on device 300 (e.g., similar to tactile outputgenerator(s) 163 described above with reference to FIG. 1A), sensors 359(e.g., touch-sensitive, optical, contact intensity, proximity,acceleration, attitude, and/or magnetic sensors similar to sensors 112,164, 165, 166, 167, 168, and 169 described above with reference to FIG.1A). Memory 370 includes high-speed random access memory, such as DRAM,SRAM, DDR RAM or other random access solid state memory devices; andoptionally includes non-volatile memory, such as one or more magneticdisk storage devices, optical disk storage devices, flash memorydevices, or other non-volatile solid state storage devices. Memory 370optionally includes one or more storage devices remotely located fromCPU(s) 310. In some embodiments, memory 370 stores programs, modules,and data structures analogous to the programs, modules, and datastructures stored in memory 102 of portable multifunction device 100(FIG. 1A), or a subset thereof. Furthermore, memory 370 optionallystores additional programs, modules, and data structures not present inmemory 102 of portable multifunction device 100. For example, memory 370of device 300 optionally stores drawing module 380, presentation module382, word processing module 384, website creation module 386, diskauthoring module 388, and/or spreadsheet module 390, while memory 102 ofportable multifunction device 100 (FIG. 1A) optionally does not storethese modules.

Each of the above identified elements in FIG. 3 are, optionally, storedin one or more of the previously mentioned memory devices. Each of theabove identified modules corresponds to a set of instructions forperforming a function described above. The above identified modules orprograms (i.e., sets of instructions) need not be implemented asseparate software programs, procedures or modules, and thus varioussubsets of these modules are, optionally, combined or otherwisere-arranged in various embodiments. In some embodiments, memory 370optionally stores a subset of the modules and data structures identifiedabove. Furthermore, memory 370 optionally stores additional modules anddata structures not described above.

Attention is now directed towards embodiments of user interfaces (“UI”)that are, optionally, implemented on portable multifunction device 100.

FIG. 4A illustrates an example user interface for a menu of applicationson portable multifunction device 100 in accordance with someembodiments. Similar user interfaces are, optionally, implemented ondevice 300. In some embodiments, user interface 400 includes thefollowing elements, or a subset or superset thereof:

-   -   Signal strength indicator(s) 402 for wireless communication(s),        such as cellular and Wi-Fi signals;    -   Time 404;    -   Bluetooth indicator 405;    -   Battery status indicator 406;    -   Tray 408 with icons for frequently used applications, such as:        -   Icon 416 for telephone module 138, labeled “Phone,” which            optionally includes an indicator 414 of the number of missed            calls or voicemail messages;        -   Icon 418 for e-mail client module 140, labeled “Mail,” which            optionally includes an indicator 410 of the number of unread            e-mails;        -   Icon 420 for browser module 147, labeled “Browser”; and        -   Icon 422 for video and music player module 152, also            referred to as iPod (trademark of Apple Inc.) module 152,            labeled “iPod”; and    -   Icons for other applications, such as:        -   Icon 424 for IM module 141, labeled “Text”;        -   Icon 426 for calendar module 148, labeled “Calendar”;        -   Icon 428 for image management module 144, labeled “Photos”;        -   Icon 430 for camera module 143, labeled “Camera”;        -   Icon 432 for online video module 155, labeled “Online            Video”;        -   Icon 434 for stocks widget 149-2, labeled “Stocks”;        -   Icon 436 for map module 154, labeled “Map”;        -   Icon 438 for weather widget 149-1, labeled “Weather”;        -   Icon 440 for alarm clock widget 169-6, labeled “Clock”;        -   Icon 442 for workout support module 142, labeled “Workout            Support”;        -   Icon 444 for notes module 153, labeled “Notes”; and        -   Icon 446 for a settings application or module, which            provides access to settings for device 100 and its various            applications 136.

It should be noted that the icon labels illustrated in FIG. 4A aremerely examples. For example, in some embodiments, icon 422 for videoand music player module 152 is labeled “Music” or “Music Player.” Otherlabels are, optionally, used for various application icons. In someembodiments, a label for a respective application icon includes a nameof an application corresponding to the respective application icon. Insome embodiments, a label for a particular application icon is distinctfrom a name of an application corresponding to the particularapplication icon.

FIG. 4B illustrates an example user interface on a device (e.g., device300, FIG. 3) with a touch-sensitive surface 451 (e.g., a tablet ortouchpad 355, FIG. 3) that is separate from the display 450. Device 300also, optionally, includes one or more contact intensity sensors (e.g.,one or more of sensors 359) for detecting intensity of contacts ontouch-sensitive surface 451 and/or one or more tactile output generators359 for generating tactile outputs for a user of device 300.

FIG. 4B illustrates an example user interface on a device (e.g., device300, FIG. 3) with a touch-sensitive surface 451 (e.g., a tablet ortouchpad 355, FIG. 3) that is separate from the display 450. Althoughmany of the examples that follow will be given with reference to inputson touch screen display 112 (where the touch sensitive surface and thedisplay are combined), in some embodiments, the device detects inputs ona touch-sensitive surface that is separate from the display, as shown inFIG. 4B. In some embodiments, the touch-sensitive surface (e.g., 451 inFIG. 4B) has a primary axis (e.g., 452 in FIG. 4B) that corresponds to aprimary axis (e.g., 453 in FIG. 4B) on the display (e.g., 450). Inaccordance with these embodiments, the device detects contacts (e.g.,460 and 462 in FIG. 4B) with the touch-sensitive surface 451 atlocations that correspond to respective locations on the display (e.g.,in FIG. 4B, 460 corresponds to 468 and 462 corresponds to 470). In thisway, user inputs (e.g., contacts 460 and 462, and movements thereof)detected by the device on the touch-sensitive surface (e.g., 451 in FIG.4B) are used by the device to manipulate the user interface on thedisplay (e.g., 450 in FIG. 4B) of the multifunction device when thetouch-sensitive surface is separate from the display. It should beunderstood that similar methods are, optionally, used for other userinterfaces described herein.

Additionally, while the following examples are given primarily withreference to finger inputs (e.g., finger contacts, finger tap gestures,finger swipe gestures, etc.), it should be understood that, in someembodiments, one or more of the finger inputs are replaced with inputfrom another input device (e.g., a mouse based input or a stylus input).For example, a swipe gesture is, optionally, replaced with a mouse click(e.g., instead of a contact) followed by movement of the cursor alongthe path of the swipe (e.g., instead of movement of the contact). Asanother example, a tap gesture is, optionally, replaced with a mouseclick while the cursor is located over the location of the tap gesture(e.g., instead of detection of the contact followed by ceasing to detectthe contact). Similarly, when multiple user inputs are simultaneouslydetected, it should be understood that multiple computer mice are,optionally, used simultaneously, or a mouse and finger contacts are,optionally, used simultaneously.

As used herein, the term “focus selector” refers to an input elementthat indicates a current part of a user interface with which a user isinteracting. In some implementations that include a cursor or otherlocation marker, the cursor acts as a “focus selector,” so that when aninput (e.g., a press input) is detected on a touch-sensitive surface(e.g., touchpad 355 in FIG. 3 or touch-sensitive surface 451 in FIG. 4B)while the cursor is over a particular user interface element (e.g., abutton, window, slider or other user interface element), the particularuser interface element is adjusted in accordance with the detectedinput. In some implementations that include a touch-screen display(e.g., touch-sensitive display system 112 in FIG. 1A or the touch screenin FIG. 4A) that enables direct interaction with user interface elementson the touch-screen display, a detected contact on the touch-screen actsas a “focus selector,” so that when an input (e.g., a press input by thecontact) is detected on the touch-screen display at a location of aparticular user interface element (e.g., a button, window, slider orother user interface element), the particular user interface element isadjusted in accordance with the detected input. In some implementations,focus is moved from one region of a user interface to another region ofthe user interface without corresponding movement of a cursor ormovement of a contact on a touch-screen display (e.g., by using a tabkey or arrow keys to move focus from one button to another button); inthese implementations, the focus selector moves in accordance withmovement of focus between different regions of the user interface.Without regard to the specific form taken by the focus selector, thefocus selector is generally the user interface element (or contact on atouch-screen display) that is controlled by the user so as tocommunicate the user's intended interaction with the user interface(e.g., by indicating, to the device, the element of the user interfacewith which the user is intending to interact). For example, the locationof a focus selector (e.g., a cursor, a contact, or a selection box) overa respective button while a press input is detected on thetouch-sensitive surface (e.g., a touchpad or touch screen) will indicatethat the user is intending to activate the respective button (as opposedto other user interface elements shown on a display of the device).

User Interfaces and Associated Processes

Attention is now directed toward embodiments of user interfaces (“UI”)and associated processes that may be implemented on an electronicdevice, such as a portable multifunction device 100 with a display, atouch-sensitive surface, and optionally one or more sensors to detectintensity of contacts with the touch-sensitive surface, or a device 300with a one or more processors, non-transitory memory, a display, and aninput device.

FIGS. 5A-5R illustrate example user interfaces for managing electroniccommunications in accordance with some embodiments. The user interfacesin these figures are used to illustrate the processes described below,including the processes in FIGS. 8A-8C and 9A-9C. Although some of theexamples which follow will be given with reference to inputs on atouch-screen display (where the touch-sensitive surface and the displayare combined), in some embodiments, the device detects inputs on atouch-sensitive surface 451 that is separate from the display 450, asshown in FIG. 4B.

FIG. 5A illustrates displaying a folder view 502 associated with aninbox folder within the display area 501 of the device 100. For example,the inbox folder is one of a plurality of folders associated with anelectronic mail (email) and/or messaging application. In someembodiments, the inbox folder includes electronic communications toand/or from the user of the device 100. For example, the electroniccommunications include email conversations, email messages, instantmessage conversations, instant messages, SMSs, MMSs, talk-to-text,and/or the like. In some embodiments, the content displayed within thedisplay area 501 corresponds to a grouping of electronic communicationssuch as a specific folder, category, or tag. In some embodiments, theuser of the device 100 is able to select between different groupings ofelectronic communications such as folders, categories, or tags.

As shown in FIG. 5A, the inbox folder view 502 includes: a backaffordance 516 a, which, when activated (e.g., with a contact), causesthe inbox folder view 502 to be replaced with a previous view or pane;and an edit affordance 516 b for marking, moving, and archivingelectronic communications in the inbox folder. As shown in FIG. 5A, theinbox folder view 502 also includes: a filter affordance 518 a, which,when activated (e.g., with a contact), causes the messages,conversations, and/or bundles associated with the inbox folder to befiltered according to a set of filter criteria or a filter pane to bedisplayed; and a draft affordance 518 b, which, when activated (e.g.,with a contact), causes the inbox folder view 502 to be replaced with aninterface for drafting a new message.

As shown in FIG. 5A, the inbox folder view 502 further includes aplurality of rows in a condensed view mode. In some embodiments, a rowrepresents a plurality of messages (e.g., electronic communications)that satisfy one or more conversation criteria (e.g., a conversationwith one or more messages with similar subjects, content, senders,recipients, and/or the like). In some embodiments, a row represents aplurality of messages (e.g., electronic communications) that satisfy acategory criterion (e.g., a bundle of promotional, finance, socialactivity, etc. messages). In some embodiments, a row represents a singlemessage.

In FIG. 5A, the first row corresponds to a conversation 504 a (e.g.,with two messages). The first row includes: a timestamp of a mostrecently received message in the conversation 504 a; the sender(s) ofmessages in the conversation 504 a; the subject of the conversation 504a (e.g., “Apple Picking”); a blurb/snapshot of the contents of theconversation 504 a; and a view mode affordance 514 a, which, whenactivated (e.g., with a contact), causes the first row to change fromthe condensed view mode to an expanded view mode. For example, thedouble chevrons associated with the view mode affordance 514 a indicatethat the conversation 504 a includes two or more messages. For example,the horizontal orientation of the chevrons associated with the view modeaffordance 514 a indicate that the first row associated with theconversation 504 a is displayed in the condensed view mode. The firstrow also includes an icon 519 indicating that the conversation 504 aincludes one or more unread messages.

In FIG. 5A, the second row corresponds to a bundle of messages 504 bassociated with an updates criterion 515. The second row includes: atimestamp of a most recently received message in the bundle of messages504 b; the sender(s) of messages in the bundle of messages 504 b; and aview mode affordance 514 b, which, when activated (e.g., with acontact), causes the second row to change from the condensed view modeto an expanded view mode.

In FIG. 5A, the second row also includes a messages affordance 517indicating the total number of messages included in the bundle ofmessages 504 b received today and the number of unread messages includedin the bundle of messages 504 b. In some embodiments, when activated(e.g., with a contact), the messages affordance 517 causes display ofall messages included in the bundle of messages 504 b (e.g., FIGS.5O-5P). In some embodiments, when activated (e.g., with a contact), themessages affordance 517 causes display of the unread messages includedin the bundle of messages 504 b. For example, the double chevronsassociated with the view mode affordance 514 b indicate that the bundleof messages 504 b includes two or more messages. For example, thehorizontal orientation of the chevrons associated with the view modeaffordance 514 b indicate that the second row associated with the bundleof messages 504 b is displayed in the condensed view mode. The secondrow further includes an icon 519 indicating that the bundle of messages504 b includes one or more unread messages.

As shown in FIG. 5A, the third row corresponds to a conversation 504 c(e.g., with one message), and the fourth row corresponds to aconversation 504 d (e.g., with one message). The third and fourth rowsare similar to and adapted from the first row. As such, the third andfourth rows are not described for the sake of brevity. In FIG. 5A, thethird row includes a view mode affordance 514 c, which, when activated(e.g., with a contact), causes the third row to change from thecondensed view mode to an expanded view mode. For example, the singlechevron associated with the view mode affordance 514 c indicates thatthe conversation 504 c includes a single message. For example, thehorizontal orientation of the chevron associated with the view modeaffordance 514 c indicates that the third row associated with theconversation 504 c is displayed in the condensed view mode.

FIGS. 5A-5B illustrate a sequence in which additional information (e.g.,the conversation view 532) for a first plurality of messages thatsatisfy one or more conversation criteria (e.g., the conversation 504 a)replaces display of an inbox folder view 502. FIG. 5A also illustratesdetecting a contact 520 at a location corresponding to the view modeaffordance 514 a.

In some embodiments, in response to selection of the view modeaffordance 514 a (e.g., FIG. 5A), the first row associated with theconversation 504 a changes from the condensed view to an expanded viewwith additional information corresponding to two or more messages fromthe conversation 504 a of related messages that are represented by thefirst row. In some embodiments, in response to selection of a view modeaffordance in the first row displayed in the inbox folder region/pane(e.g., FIG. 6A), additional information corresponding to two or moremessages from the conversation of related messages that are representedby the first row is displayed. In some embodiments, the additionalinformation is displayed in a conversation view 532 that replaces theinbox folder view 502 (e.g., FIG. 5B). In some embodiments, theadditional information is displayed inline in the inbox folder view 502(e.g., FIG. 5C). In some embodiments, the additional information isdisplayed in an adjacent content region/pane (e.g., FIG. 6B).

FIG. 5B illustrates replacing display of the inbox folder view 502 witha conversation view 532 with messages 534 a and 534 b associated withthe conversation 504 a in response to selection of the view modeaffordance 514 a in FIG. 5A. As such, the first row associated with theconversation 504 a changes from the condensed view in FIG. 5A to theexpanded view in FIG. 5B with additional information corresponding totwo or more messages from the conversation 504 a.

As shown in FIG. 5B, the conversation view 532 includes a plurality ofrows in the condensed view mode. For example, in FIG. 5B, each of therows corresponds to a message included in the conversation 504 a. Forexample, the conversation 504 a includes messages 534 a and 534 b, whichsatisfy the one or more conversation criteria (e.g., similar subjects,content, senders, recipients, and/or the like).

In FIG. 5B, the first row corresponds to the message 534 a. The firstrow includes: a timestamp for the message 534 a; the sender of themessage 534 a; the subject of the message 534 a; a blurb/snapshot of thecontents of the message 534; and a view mode affordance 544 a, which,when activated (e.g., with a contact), causes the first row to changefrom the condensed view mode to an expanded view mode (e.g., showing thefull contents of the message 534 a). The first row also includes an icon519 indicating that the message 534 a is unread.

In FIG. 5B, the second row corresponds to the message 534 b. The secondrow includes: a timestamp for the message 534 b; the sender of themessage 534 b; the subject of the message 534 b; a blurb/snapshot of thecontents of the message 534 b; and a view mode affordance 544 b, which,when activated (e.g., with a contact), causes the first row to changefrom the condensed view mode to an expanded view mode (e.g., showing thefull contents of the message 534 b). The second row also includes anicon 519 indicating that the message 534 b is unread.

FIG. 5A and FIG. 5C illustrate another sequence in which additionalinformation for a first plurality of messages that satisfy one or moreconversation criteria (e.g., the conversation 504 a) is displayed inlinein the inbox folder view 502. FIG. 5C illustrates displaying messages534 a and 534 b associated with the conversation 504 a inline in theinbox folder view 502 in response to selection of the view modeaffordance 514 a in FIG. 5A. As such, the first row associated with theconversation 504 a changes from the condensed view in FIG. 5A to theexpanded view in FIG. 5C with additional information corresponding totwo or more messages from the conversation 504 a.

FIG. 5C is similar to and adapted from FIG. 5B. As such, FIG. 5B andFIG. 5C include similar user interfaces and elements labeled with thesame reference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. For example,the conversation 504 a includes the messages 534 a and 534 b, whichsatisfy the one or more conversation criteria (e.g., similar subjects,content, senders, recipients, and/or the like). As shown in FIG. 5C, themessages 534 a and 534 b are displayed inline in the inbox folder view502. For example, the vertical orientation of the chevrons associatedwith the view mode affordance 514 a indicate that the first rowassociated with the conversation 504 a is displayed in the expanded viewmode.

FIGS. 5D-5E illustrate a sequence in which additional information (e.g.,a bundle view 552) for a second plurality of messages that satisfy afirst category criterion (e.g., the bundle of messages 504 b associatedwith an updates criterion 515) replaces display of an inbox folder view502. FIG. 5D is similar to and adapted from FIG. 5A. As such, FIG. 5Aand FIG. 5D include similar user interfaces and elements labeled withthe same reference number in both figures have the same function, onlythe differences are described herein for the sake of brevity. FIG. 5Dillustrates detecting a contact 550 at a location corresponding to theview mode affordance 514 b.

In some embodiments, in response to selection of the view modeaffordance 514 b (e.g., FIG. 5D), the second row associated with thebundle of messages 504 b changes from the condensed view to an expandedview with additional information corresponding to two or more messagesfrom the bundle of messages 504 b represented by the second row. In someembodiments, in response to selection of the view mode affordance in thesecond row displayed in the inbox folder region/pane (e.g., FIG. 5N),additional information corresponding to two or more messages from thebundle of messages represented by the second row is displayed. In someembodiments, the additional information is displayed in a bundle view552 that replaces the inbox folder view 502 (e.g., FIG. 5E). In someembodiments, the additional information is displayed inline in the inboxfolder view 502 (e.g., FIG. 5F). In some embodiments, the additionalinformation is displayed in an adjacent content region/pane (e.g., FIG.5O).

FIG. 5E illustrates replacing display of the inbox folder view 502 witha bundle view 552 in response to detecting selection of the view modeaffordance 514 b in FIG. 5D. As such, the second row associated with thebundle of messages 504 b changes from the condensed view in FIG. 5D tothe expanded view in FIG. 5E with additional information correspondingto two or more messages from the bundle of messages 504 b.

As shown in FIG. 5E, the bundle view 552 includes a plurality of rows incondensed view mode. For example, in FIG. 5E, each of the rowscorresponds to a message included in the bundle of messages 504 b. Forexample, the bundle of messages 504 b at least includes messages 554 a,554 b, and 554 c, which satisfy a first category criterion associatedwith the updates criterion 515 (e.g., messages with content related tosocial media updates/notification).

In FIG. 5E, the first row corresponds to the message 554 a. The firstrow includes: a timestamp for the message 554 a; the sender of themessage 554 a; the subject of the message 554 a; a blurb/snapshot of thecontents of the message 554 a; and a view mode affordance 564 a, which,when activated (e.g., with a contact), causes the first row to changefrom the condensed view mode to an expanded view mode (e.g., showing thefull contents of the message 554 a). The first row also includes an icon519 indicating that the message 554 a is unread.

In FIG. 5E, the second row corresponds to the message 554 b. The secondrow includes: a timestamp for the message 554 b; the sender of themessage 554 b; the subject of the message 554 b; a blurb/snapshot of thecontents of the message 554 b; and a view mode affordance 564 b, which,when activated (e.g., with a contact), causes the second row to changefrom the condensed view mode to an expanded view mode (e.g., showing thefull contents of the message 554 b). The second row also includes anicon 519 indicating that the message 554 b is unread.

In FIG. 5E, the third row corresponds to the message 554 c. The thirdrow includes: a timestamp for the message 554 c; the sender of themessage 554 c; the subject of the message 554 c; a blurb/snapshot of thecontents of the message 554 c; and a view mode affordance 564 c, which,when activated (e.g., with a contact), causes the second row to changefrom the condensed view mode to an expanded view mode (e.g., showing thefull contents of the message 554 c). The third row also includes an icon519 indicating that the message 554 c is unread.

In FIG. 5E, the bundle view 552 also includes the messages affordance517 indicating the total number of messages included in the bundle ofmessages 504 b received today and the number of unread messages includedin the bundle of messages 504 b. In some embodiments, when activated(e.g., with a contact), the messages affordance 517 causes display ofall messages included in the bundle of messages 504 b (e.g., FIGS.5O-5P). In some embodiments, when activated (e.g., with a contact), themessages affordance 517 causes display of the unread messages includedin the bundle of messages 504 b.

FIGS. 5D and 5F illustrate another sequence in which additionalinformation for a second plurality of messages that satisfy a firstcategory criterion (e.g., the bundle of messages 504 b associated withan updates criterion 515) is displayed inline in the inbox folder view502. FIG. 5F illustrates displaying the messages 554 a, 554 b, and 554 cassociated with the bundle of messages 504 b inline in the inbox folderview 502 in response to detecting selection of the view mode affordance514 b in FIG. 5D. As such, the second row associated with the bundle ofmessages 504 b changes from the condensed view in FIG. 5D to theexpanded view in FIG. 5F with additional information corresponding totwo or more messages from the bundle of messages 504 b.

FIG. 5F is similar to and adapted from FIG. 5E. As such, FIG. 5E andFIG. 5F include similar user interfaces and elements labeled with thesame reference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. For example,the bundle of messages 504 b at least includes the messages 554 a, 554b, and 554 c, which satisfy the updates criterion 515 (e.g., messageswith content related to social media updates/notification). As shown inFIG. 5F, the messages 554 a, 554 b, and 554 c are displayed inline inthe inbox folder view 502. For example, the vertical orientation of thechevrons associated with view mode affordance 514 b indicate that thesecond row associated with the bundle of messages 504 b is displayed inthe expanded view mode.

FIG. 5F also illustrates detecting a contact 565 at a location thatcorresponds to the message 554 a. FIG. 5G illustrates replacing theinbox folder view 502 with a message view 572 for the message 554 a inresponse to detecting selection of the message 554 a in FIG. 5F. Asshown in FIG. 5G, the message view 572 includes the contents 574 of themessage 554 a. The message view 572 also includes: a next messageaffordance 576 a, which, when activated (e.g., with a contact), causesthe message view 572 for the message 554 a to be replaced with a messageview for a next message in the inbox folder (e.g., the message 554 b);and a previous message affordance 576 b, which, when activated (e.g.,with a contact), causes the message view 572 for the message 554 a to bereplaced with a message view for a previous message in the inbox folder(e.g., the conversation 504 a). The message view 572 further includes: aflag affordance 578 a for flagging the message 554 a; a move folderaffordance 578 b for moving the message 554 a from the inbox folder toanother folder; an archive affordance 578 c for archiving the message554 a; a reply affordance 578 d for replying to or forwarding themessage 554 a; and a draft affordance 578 e for drafting a new message.

FIGS. 5H-5J illustrate a sequence in which a filter pane 582 isdisplayed and the filter criteria are changed in response to detecting auser input associated with a second input type (e.g., a one finger longpress gesture) on the filter affordance 518 a. FIG. 5H is similar to andadapted from FIG. 5A. As such, FIG. 5A and FIG. 5H include similar userinterfaces and elements labeled with the same reference number in bothfigures have the same function, only the differences are describedherein for the sake of brevity. FIG. 5H illustrates detecting a onefinger long press gesture with a contact 580 at a location correspondingto the filter affordance 518 a.

FIG. 5I illustrates replacing display of the inbox folder view 502 witha filters pane 582 in response to selection of the filter affordance 518a with the one finger long press gesture in FIG. 5H. In FIG. 5I, thefilters pane 582 includes: an inbox filter 586 a, an important filter586 b, a VIP filter 586 c, a flagged filter 586 d, an unread filter 586e, a “To or CC” filter 586 f, and an attachments filter 586 g. As shownin FIG. 5I, the unread filter 586 e is currently enabled as part of theset of filter criteria as indicated by the icon 588 a associated withthe unread filter 586 e. In FIG. 5I, the filters pane 582 also includes:a done affordance 584, which, when activated (e.g., with a contact),causes the filter pane 582 to be replaced with the previous view/pane(e.g., the inbox folder view 502 in FIG. 5H); and create custom filteraffordance 590 for creating and adding a custom filter to the filterpane 582. According to some embodiments, the filters pane 582 replacesdisplay of the inbox folder view 502 when a one finger long pressgesture is detected over the filter affordance 518 a while the set offilter criteria are active (e.g., currently applied to the inboxfolder).

FIG. 5I also illustrates detecting a contact 592 at a locationcorresponding to the important filter 586 b. FIG. 5J illustrates thatthe important filter 586 b is enabled as part of the set of filtercriteria as indicated by the icon 588 b associated with the importantfilter 586 b in response to selection of the important filter 586 b inFIG. 5I. FIG. 5J also illustrates detecting a contact 594 at a locationcorresponding to the done affordance 584.

FIG. 5K illustrates replacing display of the filter pane 582 with theinbox folder view 502 in response to selection of the done affordance584 in FIG. 5J. FIG. 5K is similar to and adapted from FIG. 5H. As such,FIG. 5H and FIG. 5K include similar user interfaces and elements labeledwith the same reference number in both figures have the same function,only the differences are described herein for the sake of brevity.

FIGS. 5K-5L illustrate a sequence in which filter criteria (e.g., theenabled filters) are applied to the inbox folder in response todetecting a user input associated with a first input type (e.g., a onefinger tap gesture) on the filter affordance 518 a. FIG. 5K alsoillustrates detecting a one finger tap gesture with a contact 596 at alocation corresponding to the filter affordance 518 a.

FIG. 5L illustrates replacing display of the inbox folder view 502 witha filtered inbox folder view 5114 in response to selection of the filteraffordance 518 a with the one finger tap in FIG. 5K. As shown in FIG.5L, the filtered inbox folder view 5114 includes a plurality of rows incondensed view mode. According to some embodiments, each of the rows inFIG. 5L represents one or more messages (e.g., a bundle of messages, aconversation with a single message, or a conversation with a pluralityof messages) that satisfy the set of filter criteria (e.g., theimportant filter 586 b and the unread filter 586 e). As such, in someembodiments, at least some of the messages shown in filtered inboxfolder view 5114 are both unread and marked as important. In someembodiments, at least some of the messages shown in filtered inboxfolder view 5114 are either unread or marked as important.

In FIG. 5L, the filtered inbox folder view 5114 includes: a conversation504 a, a conversation 504 f, a conversation 504 g, a conversation 504 h,a conversation 504 i, a conversation 504 j, and a conversation 504 k(partially occluded). As shown in FIG. 5L, the conversation 504 a isseparated from the conversation 504 f by an expansion affordance 5102 a.According to some embodiments, the expansion affordance 5102 a indicatesthat a first set of one or more messages with timestamps between thetimestamp associated with the conversation 504 a and the timestampassociated with the conversation 504 f have been elided. For example,the first set of one or more messages are elided due to not satisfyingthe set of filter criteria. When activated (e.g., with a contact), theexpansion affordance 5102 a causes the first set of one or more elidedmessages to be displayed between the conversation 504 a and theconversation 504 f.

Similarly, in FIG. 5L, the conversation 504 i is separated from theconversation 504 j by an expansion affordance 5102 b. According to someembodiments, the expansion affordance 5102 b indicates that a second setof one or more messages with timestamps between the timestamp associatedwith the conversation 504 i and the timestamp associated with theconversation 504 j have been elided. For example, the one or moremessages are elided due to not satisfying the filter criteria. Whenactivated (e.g., with a contact), the expansion affordance 5102 b causesthe second set of one or more elided messages to be displayed betweenthe conversation 504 i and the conversation 504 j.

In FIG. 5L, the filtered inbox folder view 5114 also includes anindication 598 of the set of filters applied to the current folder(e.g., the important filter 586 b and the unread filter 586 e). In someembodiments, the indication 598 includes a text description of the setof filters applied to the current folder as shown in FIG. 5L. In someembodiments, the indication 598 includes one or more distinct iconsassociated with the filters in the set of filters applied to the currentfolder.

FIGS. 5L-5M illustrate a sequence in which elided messages are displayedwithin the filtered inbox folder view 5114. FIG. 5L further illustratesdetecting a contact 5100 at a location corresponding to the expansionaffordance 5102 a. FIG. 5M illustrates displaying a first set of elidedmessages within the filtered inbox folder view 5114 in response toselection of the expansion affordance 5102 a in FIG. 5L. As shown inFIG. 5M, the first set of elided messages corresponding to theconversations 504 e, 504 c, and 504 d is displayed between theconversations 504 a and 504 f.

FIG. 5N illustrates displaying a dual-pane user interface associatedwith an electronic mail (email) and/or messaging application thatincludes a folders pane 5110 and a content pane 5120 within the displayarea 501 of the device 100. As shown in FIG. 5N, the folders pane 5110corresponds to an inbox folder that includes electronic communicationsto and/or from the user of the device 100. For example, the electroniccommunications include email conversations, email messages, instantmessage conversations, instant messages, SMSs, MMSs, talk-to-text,and/or the like. In some embodiments, the content displayed within thefolders pane 5110 corresponds to a grouping of electronic communicationssuch as a specific folder, category, or tag. In some embodiments, theuser of the device 100 is able to select between different groupings ofelectronic communications such as folders, categories, or tags.

As shown in FIG. 5N, the folders pane 5110 includes: a back affordance516 a, which, when activated (e.g., with a contact), causes the folderspane 5110 associated with the inbox folder to be replaced with aprevious view or pane; and an edit affordance 516 b for marking, moving,and archiving electronic communications in the inbox folder. As shown inFIG. 5N, the folders pane 5110 also includes a filter affordance 518 a,which, when activated (e.g., with a contact), causes the messages,conversations, and/or bundles associated with the inbox folder to befiltered according to a set of filter criteria or a filter pane/menu tobe displayed.

As shown in FIG. 5N, the folders pane 5110 further includes a pluralityof rows corresponding to conversations with one or more message, bundlesof messages, or single messages. In some embodiments, a row represents aplurality of messages (e.g., electronic communications) that satisfy oneor more conversation criteria (e.g., a conversation with one or moremessages with similar subjects, content, senders, recipients, and/or thelike). In some embodiments, a row represents a plurality of messages(e.g., electronic communications) that satisfy a category criterion(e.g., a bundle of promotional, finance, social activity, etc.messages). In some embodiments, a row represents a single message.

In FIG. 5N, the first row in the folders pane 5110 corresponds to aconversation 5112 a (e.g., with one message). The first row includes: atimestamp for the conversation 5112 a; the sender of the conversation5112 a; the subject of the conversation 5112 a (e.g., “Request for ShoreLeave”); a blurb/snapshot of the contents of the conversation 5112 a;and a view mode affordance 5114 a, which, when activated (e.g., with acontact), causes the first row to change from the expanded view mode tothe condensed view mode. For example, the single chevron associated withthe view mode affordance 5114 a indicates that the conversation 5112 aincludes one message. For example, the vertical orientation of thechevron associated with the view mode affordance 5112 a indicates thatthe first row associated with the conversation 5112 a is displayed inthe expanded view mode (e.g., with the contents 5122 of the conversation5112 a shown in the content pane 5120).

In FIG. 5N, the second row in the folders pane 5110 corresponds to abundle of messages 5112 b associated with a travel criterion 5115 a. Thesecond row includes: a timestamp of a most recently received message inthe bundle of messages 5112 b; the sender(s) of messages in the bundleof messages 5112 b; and a view mode affordance 5114 b, which, whenactivated (e.g., with a contact), causes the second row to change fromthe condensed view mode to an expanded view mode.

In FIG. 5N, the second row also includes a messages affordance 5117 aindicating the total number of messages included in the bundle ofmessages 5112 b received today and the number of unread messagesincluded in the bundle of messages 5112 b. In some embodiments, whenactivated (e.g., with a contact), the messages affordance 5117 a causesdisplay of all messages included in the bundle of messages 5112 b in thecontent pane 5120. In some embodiments, when activated (e.g., with acontact), the messages affordance 5117 a causes display of the unreadmessages included in the bundle of messages 5112 b in the content pane5120. For example, the double chevrons associated with the view modeaffordance 5114 b indicate that the bundle of messages 5112 b includestwo or more messages. For example, the horizontal orientation of thechevrons associated with the view mode affordance 5114 b indicate thatthe second row associated with the bundle of messages 5112 b isdisplayed in the condensed view mode. The second row further includes anicon 519 indicating that the bundle of messages 5112 b includes one ormore unread messages.

In FIG. 5N, the third row in the folders pane 5110 corresponds to aconversation 5112 c (e.g., with one message). The third row includes: atimestamp for the conversation 5112 c; the sender of the conversation5112 c; the subject of the conversation 5112 c (e.g., “DehydrationMachine”); a blurb/snapshot of the contents of the conversation 5112 c;and a view mode affordance 5114 c, which, when activated (e.g., with acontact), causes the third row to change from the expanded view mode tothe condensed view mode. For example, the single chevron associated withthe view mode affordance 5114 c indicates that the conversation 5112 cincludes one message. For example, the horizontal orientation of thechevron associated with the view mode affordance 5112 c indicates thatthe first row associated with the conversation 5112 c is displayed inthe condensed view mode. The first row also includes an icon 519indicating that the conversation 5112 c includes an unread message.

In FIG. 5N, the fourth row in the folders pane 5110 corresponds to abundle of messages 5112 d associated with a fashion criterion 5115 b.The fourth row includes: a timestamp of a most recently received messagein the bundle of messages 5112 d; the sender(s) of messages in thebundle of messages 5112 d; and a view mode affordance 5114 d, which,when activated (e.g., with a contact), causes the fourth row to changefrom the condensed view mode to an expanded view mode.

In FIG. 5N, the fourth row also includes a messages affordance 5117 bindicating the total number of messages included in the bundle ofmessages 5112 d received today and the number of unread messagesincluded in the bundle of messages 5112 d. In some embodiments, whenactivated (e.g., with a contact), the messages affordance 5117 b causesdisplay of all messages included in the bundle of messages 5112 d in thecontent pane 5120. In some embodiments, when activated (e.g., with acontact), the messages affordance 5117 b causes display of the unreadmessages included in the bundle of messages 5112 d in the content pane5120. For example, the double chevrons associated with the view modeaffordance 5114 d indicate that the bundle of messages 5112 d includestwo or more messages. For example, the horizontal orientation of thechevrons associated with the view mode affordance 5114 d indicate thatthe fourth row associated with the bundle of messages 5112 d isdisplayed in the condensed view mode. The fourth row further includes anicon 519 indicating that the bundle of messages 5112 d includes one ormore unread messages.

In FIG. 5N, the fifth row in the folders pane 5110 corresponds to aconversation 5112 e (e.g., with one message). The third row includes: atimestamp for the conversation 5112 e; the sender of the conversation5112 e; the subject of the conversation 5112 c (e.g., “Battle of theCoral Sea Recap”); and a blurb/snapshot of the contents of theconversation 5112 e.

As shown in FIG. 5N, the content pane 5120 includes the contents 5122 ofthe message included in the conversation 5112 a. In FIG. 5N, the contentpane 5120 also includes: the flag affordance 578 a for flagging themessage included in the conversation 5112 a; the move folder affordance578 b for moving the message included in the conversation 5112 a fromthe inbox folder to another folder; the archive affordance 578 c forarchiving the message included in the conversation 5112 a; the replyaffordance 578 d for replying to or forwarding the message included inthe conversation 5112 a; and the draft affordance 578 e for drafting anew message.

FIGS. 5N-5O illustrate a sequence in which additional information for asecond plurality of messages that satisfy a category criterion (e.g., abundle of messages associated with the travel criterion 5115 a) isdisplayed in the content pane 5120. FIG. 5N further illustratesdetecting a contact 5124 at a location corresponding to the view modeaffordance 5114 b. FIG. 5O illustrates displaying additional informationfor the bundle of messages 5112 b in the content pane 5120 in responseto selection of the view mode affordance 5114 b in FIG. 5N. FIG. 5O issimilar to and adapted from FIG. 5N. A such, FIG. 5N and FIG. 5O includesimilar user interfaces and elements labeled with the same referencenumber in both figures have the same function, only the differences aredescribed herein for the sake of brevity.

As shown in FIG. 5O, the content pane 5120 includes a plurality of rowsin condensed view mode. For example, in FIG. 5O, each of the rowscorresponds to messages included in the bundle of messages 5112 b. Forexample, the bundle of messages 5112 b at least includes the message5132 a, the sub-bundle of messages 5132 b, and the message 5132 c, whichsatisfy a category criterion associated with the travel criterion 5115 a(e.g., messages with content related to travel, hotels, airplanetickets, etc.).

In FIG. 5O, the first row in the content pane 5120 corresponds to amessage 5132 a. The first row includes: a timestamp for the message 5132a; the sender of the message 5132 a; the subject of the message 5132 a;a blurb/snapshot of the contents of the message 5132 a; and a view modeaffordance 5134 a, which, when activated (e.g., with a contact), causesthe first row to change from the condensed view mode to an expanded viewmode (e.g., showing the full contents of the message 5132 a within thecontent pane 5120). The first row also includes an icon 519 indicatingthat the message 5132 a is unread.

In FIG. 5O, the second row in the content pane 5120 corresponds to asub-bundle of messages 5132 b. For example, the sub-bundle of messages5132 b includes messages within the bundle of messages 5112 b thatsatisfy a sub-category criterion associated with the Europe criterion5131 (e.g., messages with content related to European travel, hotels,airplane tickets, etc.). The second row also includes view modeaffordance 5134 b, which, when activated (e.g., with a contact), causesthe second row to change from the condensed view mode to an expandedview mode (e.g., showing the messages included in the sub-bundle ofmessages 5132 b within the content pane 5120). The second row alsoincludes an icon 519 indicating that one or more messages in thesub-bundle of messages 5132 b are unread.

In FIG. 5O, the second row further includes a messages affordance 5133indicating the total number of messages included in the sub-bundle ofmessages 5132 b received today and the number of unread messagesincluded in the sub-bundle of messages 5132 b. In some embodiments, whenactivated (e.g., with a contact), the messages affordance 5133 causesdisplay of all messages included in the sub-bundle of messages 5132 b inthe content pane 5120. In some embodiments, when activated (e.g., with acontact), the messages affordance 5133 causes display of the unreadmessages included in the sub-bundle of messages 5132 b in the contentpane 5120.

In FIG. 5O, the third row in the content pane 5120 corresponds to amessage 5132 c. The third row includes: a timestamp for the message 5132c; the sender of the message 5132 c; the subject of the message 5132 c;a blurb/snapshot of the contents of the message 5132 c; and a view modeaffordance 5134 c, which, when activated (e.g., with a contact), causesthe third row to change from the condensed view mode to an expanded viewmode (e.g., showing the full contents of the message 5132 c). The thirdrow also includes an icon 519 indicating that the message 5132 c isunread.

As shown in FIG. 5O, the content pane 5120 also includes the messagesaffordance 5117 a indicating the total number of messages included inthe bundle of messages 5112 b received today and the number of unreadmessages included in the bundle of messages 5112 b. In some embodiments,when activated (e.g., with a contact), the messages affordance 5117 acauses display of all messages included in the bundle of messages 5112 bin the content pane 5120. In some embodiments, when activated (e.g.,with a contact), the messages affordance 5117 a causes display of theunread messages included in the bundle of messages 5112 b in the contentpane 5120. FIG. 5O also illustrates detecting a contact 5126 at alocation corresponding to the messages affordance 5117 a within thecontent pane 5120.

In FIG. 5O, for example, the horizontal orientation of the chevronassociated with the view mode affordance 5114 a indicates that the firstrow associated with the conversation 5112 a is displayed in thecondensed view mode. For example, the vertical orientation of thechevrons associated with the view mode affordance 5114 b indicate thatthe second row associated with the bundle of messages 5112 b isdisplayed in the expanded view mode.

FIG. 5P illustrates displaying all messages for the bundle of messages5112 b within the content pane 5120 in response to selection of themessages affordance 5117 a in FIG. 5O. FIG. 5P is similar to and adaptedfrom FIG. 5O. As such, FIG. 5O and FIG. 5P include similar userinterfaces and elements labeled with the same reference number in bothfigures have the same function, only the differences are describedherein for the sake of brevity.

As shown in FIG. 5P, the content pane 5120 includes a plurality of rowsin condensed view mode. In FIG. 5P, the rows in the content pane 5120correspond to the message 5132 a, the sub-bundle of messages 5132 b, themessage 5132 c, the message 5132 d, and the message 5132 e (partiallyoccluded), which satisfy a category criterion associated with the travelcriterion 5115 a (e.g., messages with content related to travel, hotels,airplane tickets, etc.).

FIG. 5N and FIG. 5Q illustrate another sequence in which additionalinformation for a second plurality of messages that satisfy a categorycriterion (e.g., a bundle of messages associated with a travel criterion5115 a) is displayed in a content pane 5120. FIG. 5Q illustratesdisplaying additional information for the bundle of messages 5112 ainline in the folders pane 5110 and also in the content pane 5120 inresponse to selection of the view mode affordance 5114 b in FIG. 5N.FIG. 5Q is similar to and adapted from FIG. 5O. As such, FIG. 5O andFIG. 5Q include similar user interfaces and elements labeled with thesame reference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. As shown inFIG. 5Q, the conversation 5132 a included in the bundle of messages 5112a, the sub-bundle of messages 5132 b included in the bundle of messages5112 a, the conversation 5132 c included in the bundle of messages 5112a, and the messages affordance 5117 a are displayed inline in thefolders pane 5110.

In FIG. 5Q, for example, the vertical orientation of the chevronsassociated with the view mode affordance 5114 b indicate that the bundleof messages 5112 b is displayed in the expanded view mode (e.g., withadditional information displayed inline in the folders pane 5110). Forexample, the vertical orientation of the chevron associated with theview mode affordance 5134 a indicates that the conversation 5132 aincluded in the bundle of messages 5112 b is displayed in the expandedview mode (e.g., with contents 5138 displayed in the content pane 5120).

As shown in FIG. 5Q, the contents 5138 of the conversation 5132 a aredisplayed in the content pane 5120. In FIG. 5Q, the conversation 5132 ais displayed as a top message in stack of messages 5139 associated withthe bundle of messages 5112 b that satisfy the travel criterion 5115 a.

FIGS. 5Q-5R illustrate a sequence in which additional information for asecond plurality of messages that satisfy a sub-category criterion(e.g., a sub-bundle of messages associated with a Europe criterion 5131)is displayed in the content pane 5120. FIG. 5Q also illustratesdetecting a contact 5140 at a location corresponding to the view modeaffordance 5134 b associated with the sub-bundle of messages 5132 b.FIG. 5R illustrates displaying additional information for the sub-bundleof messages 5132 b inline in the inbox folder pane 5110 and also in thecontent pane 5120 in response to selection of the view mode affordance5134 b in FIG. 5Q.

FIG. 5R is similar to and adapted from FIGS. 5O-5Q. As such, FIGS. 5O-5Qand FIG. 5R include similar user interfaces and elements labeled withthe same reference number in both figures have the same function, onlythe differences are described herein for the sake of brevity. As shownin FIG. 5R, the conversation 5142 a and the conversation 5142 b includedin the sub-bundle of messages 5132 b are displayed inline in the folderspane 5110.

In FIG. 5R, for example, the vertical orientation of the chevronsassociated with the view mode affordance 5114 b indicate that the bundleof messages 5112 b is displayed in the expanded view mode (e.g., withadditional information displayed inline in the folders pane 5110). Forexample, the vertical orientation of the chevrons associated with theview mode affordance 5134 b indicate that the sub-bundle of messages5132 b is displayed in the expanded view mode (e.g., with additionalinformation displayed inline in the folders pane 5110). For example, thevertical orientation of the chevron associated with the view modeaffordance 51146 indicates that the conversation 5142 a included in thesub-bundle of messages 5132 b is displayed in the expanded view mode(e.g., with the contents 5144 displayed in the content pane 5120).

As shown in FIG. 5R, the contents 5144 of the conversation 5142 aincluded in the sub-bundle of messages 5132 b are displayed in thecontent pane 5120. In FIG. 5R, the conversation 5142 a is displayed as atop message in a stack of messages 5145 associated with the sub-bundleof messages 5132 b that satisfy the Europe criterion 5131.

FIGS. 6A-6F illustrate example user interfaces for managing electroniccommunications in accordance with some embodiments. The user interfacesin these figures are used to illustrate the processes described below,including the processes in FIGS. 8A-8C and 9A-9C. Although some of theexamples which follow will be given with reference to inputs on atouch-sensitive surface 451 that is separate from the display 450, insome embodiments, the device (e.g., the device 300) detects inputs on atouch-screen display (where the touch-sensitive surface and the displayare combined), as shown in FIG. 4A.

FIG. 6A illustrates displaying a user interface including a window 602and a dock 605 with a plurality of dock icons 606-A, 606-B, and 606-Cfor different applications within the display area 601. For example, thewindow 602 corresponds to associated an electronic mail (email) and/ormessaging application. As shown in FIG. 6A, the window 602 includes achrome region 604, a folders pane 610, and a content pane 620. In FIG.6A, the folders pane 610 corresponds to an inbox folder that includeselectronic communications to and/or from the user of the device. Forexample, the electronic communications include email conversations,email messages, instant message conversations, instant messages, SMSs,MMSs, talk-to-text, and/or the like. In some embodiments, the contentdisplayed within the folders pane 610 corresponds to a grouping ofelectronic communications such as a specific folder, category, or tag.In some embodiments, the user of the device is able to select betweendifferent groupings of electronic communications such as folders,categories, or tags.

As shown in FIG. 6A, the folders pane 610 includes a plurality of rowscorresponding to conversations 612 a, 612 b, 612 c, 612 d, 612 e, and612 f (partially occluded) each with one or more messages. In FIG. 6A,the folders pane 610 also includes: a sorting affordance 616 a, whichindicates that the inbox folder is currently sorted in chronologicalorder with the newest conversation first; and a filter affordance 616 b,which indicates zero or more filters currently applied to the inboxfolder (e.g., no filters are currently applied to the inbox folder inFIG. 6A). When activated (e.g., with a single or double click via thefocus selector 603), the sorting affordance 616 a causes the inboxfolder to be re-sorted.

When activated with a first input type (e.g., with a single click viathe focus selector 603), the filter affordance 616 b causes theapplication of a set of filter criteria to the electronic communicationsin the inbox folder (if the set of filter criteria are currentlydeactivated as shown in FIGS. 6A-6B). When activated with a first inputtype (e.g., with a single click via the focus selector 603), the filteraffordance 616 b causes deactivation of a set of filter criteria appliedto the electronic communications in the inbox folder (if the set offilter criteria are currently active as shown in FIGS. 6D-6E. Whenactivated with a second input type (e.g., with a double click via thefocus selector 603), the filter affordance 616 b causes a filter menu tobe overlaid on the window 602 (e.g., FIG. 6C).

In FIG. 6A, the first row in the folders pane 610 includes: a timestampof a most recently received message in the conversation 612 a; thesender(s) of messages in the conversation 612 a; the subject of theconversation 612 a (e.g., “Apple Picking”); a blurb/snapshot of thecontents of the conversation 612 a; and a view mode affordance 616 a,which, when activated (e.g., with the focus selector 603), causes thefirst row to change from the condensed view mode to an expanded viewmode (e.g., FIG. 6B). For example, the double chevrons associated withthe view mode affordance 616 a indicate that the conversation 612 aincludes two or more messages. For example, the horizontal orientationof the chevrons associated with the view mode affordance 616 a indicatethat the conversation 612 a is displayed in the condensed view mode. Thefirst row also includes an icon 619 indicating that the conversation 612a includes one or more unread messages.

In FIG. 6A, the second row in the folders pane 610 includes: a timestampfor the message associated with the conversation 612 b; the sender ofmessages in the message associated with the conversation 612 b; thesubject of the message associated with the conversation 612 b (e.g.,“Fort Wayne Historic Site”); a blurb/snapshot of the contents of themessage associated with the conversation 612 b; and a view modeaffordance 616 b, which, when activated (e.g., with the focus selector603), causes the second row to change from the expanded view mode to thecondensed view mode. For example, the single chevron associated with theview mode affordance 616 b indicates that the conversation 612 bincludes a single message. For example, the vertical orientation of thechevron associated with the view mode affordance 616 b indicates thatthe conversation 612 b is displayed in the expanded view mode (e.g.,with the contents 622 of the conversation 612 b displayed in the contentpane 620).

In FIG. 6A, the third row in the folders pane 610 includes: a timestampfor the message associated with the conversation 612 c; the sender ofmessages in the message associated with the conversation 612 c; thesubject of the message associated with the conversation 612 c (e.g.,“Dehydration Machine”); a blurb/snapshot of the contents of the messageassociated with the conversation 612 c; and a view mode affordance 616c, which, when activated (e.g., with the focus selector 603), causes thesecond row to change from the condensed view mode to the expanded viewmode (e.g., with the contents of the message associated with theconversation 612 c in the content pane 620). For example, the singlechevron associated with the view mode affordance 616 c indicates thatthe conversation 612 c includes a single message. For example, thehorizontal orientation of the chevron associated with the view modeaffordance 616 c indicates that the conversation 612 c is displayed inthe condensed view mode.

As shown in FIG. 6A, the content pane 620 includes the content 622 ofthe message associated with the conversation 612 b. In FIG. 6A, thecontent pane 620 also includes: a flag affordance 624 a for flagging themessage associated with the conversation 612 b; a move folder affordance624 b for moving the message associated with the conversation 612 b fromthe inbox folder to another folder; an archive affordance 624 c forarchiving the message associated with the conversation 612 b; a replyaffordance 624 d for replying to or forwarding the message associatedwith the conversation 612 b; and a draft affordance 624 e for drafting anew message.

FIGS. 6A-6B illustrate a sequence in which additional information for afirst plurality of messages that satisfy one or more conversationcriteria (e.g., the conversation 612 a) is displayed in a content pane620. FIG. 6A also illustrates displaying the focus selector 603 at alocation corresponding to the view mode affordance 616 a. FIG. 6Billustrates replacing display of the content 622 of the messageassociated with the conversation 612 b in the content pane 620 with themessages 632 a and 632 b associated with the conversation 612 a inresponse to selection of the view mode affordance 616 a in FIG. 6A. Asshown in FIG. 6B, the content pane 620 includes a plurality of rowscorresponding to the messages 632 a and 632 b.

In FIG. 6B, the first row in the content pane 620, corresponding to themessage 632 a, includes: a timestamp for the message 632 a; the senderof the message 632 a; the subject of the message 632 a; a blurb/snapshotof the contents of message 632 a; and a view mode affordance 634 a,which, when activated (e.g., with the focus selector 603), causes thefirst row to change from the condensed view mode to an expanded viewmode (e.g., showing the full contents of the message 632 a in thecontent pane 620). The first row also includes an icon 619 indicatingthat the message 632 a is unread.

In FIG. 6B, the second row in the content pane 620, corresponding to themessage 632 b, includes: a timestamp for the message 632 b; the senderof the message 632 b; the subject of the message 632 b; a blurb/snapshotof the contents of the message 632 b; and a view mode affordance 634 b,which, when activated (e.g., with the focus selector 603), causes thefirst row to change from the condensed view mode to an expanded viewmode (e.g., showing the full contents of the message 632 b in thecontent pane 620). The second row also includes an icon 619 indicatingthat the message 634 b is unread.

In FIG. 6B, for example, the vertical orientation of the chevronsassociated with the view mode affordance 616 a indicates that theconversation 612 a is displayed in the expanded view mode. For example,the horizontal orientation of the chevron associated with the view modeaffordance 616 b indicates that the conversation 612 b is displayed inthe condensed view mode.

FIGS. 6B-6C illustrate a sequence in which a filter menu 640 isdisplayed in response to detecting selection of the filter affordance616 b with a second input type (e.g., a double click with the focusselector 603). FIG. 6B also illustrates displaying the focus selector603 at a location corresponding to the filter affordance 616 b. FIG. 6Cillustrates displaying a filters menu 640 overlaid on the window 602 inresponse to selection of the filter affordance 616 b with a second inputtype (e.g., a double click with the focus selector 603) in FIG. 6B. FIG.6C is similar to and adapted from FIG. 6B. As such, FIG. 6B and FIG. 6Binclude similar user interfaces and elements labeled with the samereference number in both figures have the same function, only thedifferences are described herein for the sake of brevity.

As shown in FIG. 6C, the filters menu 640 includes: an inbox filter 642a, an important filter 642 b, a VIP filter 642 c, a flagged filter 642d, an unread filter 642 e, a “To or CC” filter 642 f, and an attachmentsfilter 642 g. As shown in FIG. 6C, the flagged filter 642 d is currentlyenabled as part of the filter criteria as indicated by the icon 646 aassociated with the flagged filter 642 d. In FIG. 6C, filters menu 640also includes a create custom filter affordance 644 for creating andadding a custom filter to the filters menu 640. According to someembodiments, the filters menu 640 is overlaid on the window 602 when aone finger long press gesture is detected over the filter affordance 616b while the set of filter criteria are active (e.g., currently appliedto the inbox folder).

FIG. 6B and FIG. 6D illustrate a sequence in which filter criteria areapplied to the inbox folder in response to detecting selection of thefilter affordance 616 b with a first input type (e.g., a single clickwith the focus selector 603). FIG. 6D illustrates displaying a filteredinbox folder in the folders pane 610 in response to detecting selectionof the filter affordance 616 b with the first input type (e.g., a singleclick with the focus selector 603) in FIG. 6B. As shown in FIG. 6D, thefiltered inbox folder includes a plurality of conversations 612 c, 612d, 612 e, 612 f, and 612 g (partially occluded) that satisfy the set offilter criteria (e.g., the flagged filter 642 d). As such, according tosome embodiments, the conversations 612 c, 612 d, 612 e, 612 f, and 612g (e.g., with one or more messages) shown in filtered inbox folder inthe folders pane 610 include one or more flagged messages.

As shown in FIG. 6D, the folders pane 610 includes an expansionaffordance 654 above the conversation 612 c. According to someembodiments, the expansion affordance 654 indicates that a set of one ormore messages with timestamps before the timestamp associated with theconversation 612 c have been elided. For example, the set of one or moremessages are elided due to not satisfying the set of filter criteria(e.g., the flagged filter 642 d). When activated (e.g., with the focusselector 603), the expansion affordance 654 causes the set of one ormore elided messages to be displayed above the conversation 612 c.

In FIG. 6D, the filter affordance 616 b includes an indication of theset of filters applied to the current folder (e.g., the flagged filter642 d). In some embodiments, the indication includes a text descriptionof the set of filters applied to the current folder as shown in FIG. 6D.In some embodiments, the indication includes one or more distinct iconsfor the set of filters applied to the current folder.

As shown in FIG. 6D, the content pane 620 includes the contents 652associated with the conversation 612 c. In FIG. 6D, for example, thevertical orientation of the chevron associated with the view modeaffordance 616 c indicates that the conversation 612 c is displayed inthe expanded view mode (e.g., the contents 652 associated with theconversation 612 c are displayed in the content pane 620).

For example, a user of the device changes the active folder in thefolder pane 610 from the inbox folder to folder A. Continuing with thisexample, FIG. 6E illustrates displaying filtered folder A in the folderspane 610 in response to switching the active folder. Moreover, the setof filter criteria (e.g., the flagged filter 642 d) are applied tofolder A after switching the active folder.

As shown in FIG. 6E, the filtered folder A includes a plurality ofconversations 662 a, 662 b, 662 c, and 662 d that satisfy the set offilter criteria (e.g., the flagged filter 642 d). As such, in someembodiments, the conversations 662 a, 662 b, 662 c, and 662 d (e.g.,with one or more messages) include one or more flagged messages. FIG. 6Ealso illustrates displaying the contents 672 of the conversation 662 ain the content pane 620.

In FIG. 6E, the first row in the folders pane 610 includes: a timestampfor the message associated with the conversation 662 a; the sender ofthe message associated with the conversation 662 a; the subject of theconversation 662 a (e.g., “Koalas in Trees”); a blurb/snapshot of thecontents of the conversation 662 a; and a view mode affordance 664 a,which, when activated (e.g., with the focus selector 603), causes thefirst row to change from the expanded view mode to the condensed viewmode. For example, the single chevron associated with the view modeaffordance 664 a indicates that the conversation 662 a includes a singlemessage. For example, the vertical orientation of the chevron associatedwith the view mode affordance 664 a indicates that the conversation 662a is displayed in the expanded view mode (e.g., with the contents 672displayed in the content pane 620).

In FIG. 6E, the second row in the folders pane 610 includes: a timestampfor the message associated with the conversation 662 b; the sender ofthe message associated with the conversation 662 b; the subject of themessage associated with the conversation 662 b (e.g., “Black Shades”); ablurb/snapshot of the contents of the message associated with theconversation 662 b; and a view mode affordance 664 b, which, whenactivated (e.g., with the focus selector 603), causes the second row tochange from the condensed view mode to the expanded view mode (e.g.,with the contents of the message associated with the conversation 662 bdisplayed in the content pane 620). For example, the single chevronassociated with the view mode affordance 664 b indicates that theconversation 662 b includes a single message. For example, thehorizontal orientation of the chevron associated with the view modeaffordance 664 b indicates that the conversation 662 b is displayed inthe condensed view mode. The second row also includes an icon 619indicating that the conversation 662 b includes one or more unreadmessages.

As shown in FIG. 6E, the folders pane 610 includes an expansionaffordance 666 below the conversation 662 d. According to someembodiments, the expansion affordance 666 indicates that a set of one ormore messages with timestamps after the timestamp associated with theconversation 662 d have been elided. For example, the set of one or moremessages are elided due to not satisfying the set of filter criteria(e.g., (e.g., the flagged filter 642 d). When activated (e.g., with thefocus selector 603), the expansion affordance 666 causes the set of oneor more elided messages to be displayed below the conversation 662 d.

FIG. 6E-6F illustrate a sequence in which the filter criteria aredeactivated. FIG. 6E further illustrates displaying the focus selector603 at a location corresponding to the filter affordance 616 b. FIG. 6Fillustrates disabling the set of filter criteria and displaying folder Ain the folders pane 610 in response to detecting selection of the filteraffordance 616 b with the first input type (e.g., a single click withthe focus selector 603) in FIG. 6E.

FIG. 6F is similar to and adapted from FIG. 6E. A such, FIG. 6E and FIG.6F include similar user interfaces and elements labeled with the samereference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. In FIG. 6F,the filter affordance 616 b indicates that no filters are currentlyapplied to folder A, as compared to FIG. 6E where the flagged filter 642d is applied to folder A. As shown in FIG. 6F, the folders pane 610includes conversations 662 a, 662 b, 662 c, 662 d, 662 e, and 662 f(partially occluded) and does not include the expansion affordance 666,as compared to FIG. 6E.

FIGS. 7A-7P illustrate example user interfaces for managing electroniccommunications in accordance with some embodiments. The user interfacesin these figures are used to illustrate the processes described below,including the processes in FIGS. 10A-10C. Although some of the exampleswhich follow will be given with reference to inputs on a touch-screendisplay (where the touch-sensitive surface and the display arecombined), in some embodiments, the device detects inputs on atouch-sensitive surface 451 that is separate from the display 450, asshown in FIG. 4B.

FIG. 7A illustrates displaying a folder view 702 associated with aninbox folder within the display area of the device 100. For example, theinbox folder is one of a plurality of folders associated with anelectronic mail (email) and/or messaging application. In someembodiments, the inbox folder includes electronic communications toand/or from the user of the device 100. For example, the electroniccommunications include email conversations, email messages, instantmessage conversations, instant messages, SMSs, MMSs, talk-to-text,and/or the like. In some embodiments, the content displayed within thedisplay area corresponds to a grouping of electronic communications suchas a specific folder, category, or tag. In some embodiments, the user ofthe device 100 is able to select between different groupings ofelectronic communications such as folders, categories, or tags.

As shown in FIG. 7A, the inbox folder view 702 includes: a backaffordance 716 a, which, when activated (e.g., with a contact), causesthe inbox folder view 702 to be replaced with a previous view or pane;and an edit affordance 716 b for marking, moving, and archivingelectronic communications in the inbox folder. As shown in FIG. 7A, theinbox folder view 702 also includes: a filter affordance 718 a, which,when activated (e.g., with a contact), causes the messages,conversations, and/or bundles associated with the inbox folder to befiltered according to a set of filter criteria or a filter pane to bedisplayed; and a draft affordance 718 b, which, when activated (e.g.,with a contact), causes the inbox folder view 702 to be replaced with aninterface for drafting a new message.

As shown in FIG. 7A, the inbox folder view 702 further includes aplurality of rows. In some embodiments, a row represents a plurality ofmessages (e.g., electronic communications) that satisfy one or moreconversation criteria (e.g., a conversation with one or more messageswith similar subjects, content, senders, recipients, and/or the like).In some embodiments, a row represents a single message.

In FIG. 7A, the first row corresponds to a conversation 704 a (e.g.,with two or more messages). The first row includes: a timestamp of amost recently received message in the conversation 704 a; the sender(s)of messages in the conversation 704 a; the subject of the conversation704 a (e.g., “Apple Picking”); and a blurb/snapshot of the contents ofthe conversation 704 a. The first row also includes an icon 719indicating that the conversation 704 a includes one or more unreadmessages.

As shown in FIG. 7A, the second row corresponds to a message 704 b(e.g., a conversation with one message). The second row includes: atimestamp associated with the message 704 b; the sender of the message704 b; the subject of the message 704 b (e.g., “Sulawesi WeatherReports”); and a blurb/snapshot of the contents of the message 704 b.The second row also includes an icon 719 indicating that the message 704b is unread.

As shown in FIG. 7A, the third row corresponds to a message 704 c (e.g.,a conversation with one message). The third row includes: a timestampassociated with the message 704 c; the sender of the message 704 c; thesubject of the message 704 c (e.g., “Dehydration Machine”); and ablurb/snapshot of the contents of the message 704 c. The third row alsoincludes an icon 719 indicating that the message 704 c is unread.

In FIG. 7A, the fourth row corresponds to a conversation 704 d (e.g.,with two or more messages). The fourth row includes: a timestamp of amost recently received message in the conversation 704 d; the sender(s)of messages in the conversation 704 d; the subject of the conversation704 d (e.g., “Battle of Leyte Gulf”); and a blurb/snapshot of thecontents of the conversation 704 d.

As shown in FIG. 7A, according to some embodiments, a respectivedimension (e.g., the height) of each of the rows in the inbox folderview 702 is the same. For example, in FIG. 7A, a respective dimension(e.g., the height) of the first row corresponding to the conversation704 a has a value 703, and the respective dimension (e.g., the height)of the second row corresponding to the message 704 b also has the value703.

FIGS. 7A-7B illustrate a sequence in which a conversation view 730replaces display of the inbox folder view 702. FIG. 7A illustratesdetecting a contact 706 at a location corresponding to the conversation704 a (e.g., a one finger tap gesture). FIG. 7B illustrates replacingdisplay of the inbox folder view 702 with the conversation view 730corresponding to the conversation 704 a in response to selection of theconversation 704 a in FIG. 7A.

As shown in FIG. 7B, the conversation view 730 includes: a header region731 a, a content region 731 b, a toolbar region 731 c, and a subject bar734. In FIG. 7B, the content region 731 b includes: a first messageregion 732 a associated with a first message in the conversation 704 a;a second message region 732 b associated with a second message in theconversation 704 a; and a portion of a third message region 732 cassociated with a third message in the conversation 704 a (sometimescollectively referred to as the “message regions 732”). For example, ifa user scrolls the conversation view 730, the balance of the thirdmessage region 732 c is displayed within the content region 731 b.

In some embodiments, the messages are sorted in reverse chronologicalorder. As such, in this example, the first message associated with themessage region 732 a is the most recent message in the conversation 704a. In some embodiments, the messages are sorted in chronological order.As such, in this example, the first message associated with the messageregion 732 a is the oldest message in the conversation 704 a. In FIG.7B, the subject bar 734 indicates the subject (e.g., “Apple Picking”) ofthe conversation 704 a.

As shown in FIG. 7B, the message regions 732 include a header sub-region736 a, a content sub-region 736 b, and a bottom sub-region 736 c. Theheader sub-region 736 a includes the sender of the correspondingmessage, the recipients of the corresponding message, the folderassociated with the corresponding message, a timestamp for thecorresponding message, and a “details” affordance 738 a, which, whenactivated (e.g., with a contact), causes additional details associatedwith a corresponding message to be displayed within the headersub-region 736 a. The content sub-region 736 b includes the content ofthe corresponding message. The bottom sub-region 736 c includes: a “seemore” affordance 738 b, which, when activated (e.g., with a contact),causes a message view of the corresponding message to replace display ofthe conversation view 730 (e.g., as shown in FIG. 7J-7K); and an actionsaffordance 738 c, which, when activated (e.g., with a contact), causes afirst set of one or more affordances to be displayed (e.g., as shown inFIGS. 7C-7D).

As shown in FIG. 7B, the header region 731 a includes: a back affordance716 a, which, when activated (e.g., with a contact), causes theconversation view 730 to be replaced with the previous view or pane(e.g., the inbox folder view 702 in FIG. 7A); and an indication of thenumber of messages in the conversation 704 a (e.g., 3 messages).According to some embodiments, the header region 731 a also includes: anext affordance 726 a, which, when activated (e.g., with a contact),causes a next conversation or message from the inbox folder to replacedisplay of the conversation 704 a within the conversation view 730; anda previous affordance 726 b, which, when activated (e.g., with acontact), causes a previous conversation or message from the inboxfolder to replace display of the conversation 704 a within theconversation view 730. According to some embodiments, the header region731 a also includes: a next affordance 726 a, which, when activated(e.g., with a contact), causes a next message region (e.g., the secondmessage region 732 b) to be displayed at the top of the conversationview 730; and a previous affordance 726 b, which, when activated (e.g.,with a contact), causes a previous message region to be displayed at thetop of the conversation view 730.

As shown in FIG. 7B, according to some embodiments, the toolbar region731 c includes: a flag affordance 728 a for flagging the messages in theconversation 704 a; a move folder affordance 728 b for moving themessages in the conversation 704 a from the inbox folder to anotherfolder; an archive affordance 728 c for archiving the messages in theconversation 704 a; a reply affordance 728 d for replying to orforwarding the conversation 704 a; and a draft affordance 728 e fordrafting a new message. According to some embodiments, the toolbarregion 731 c includes: a flag affordance 728 a for flagging a respectivemessage in the conversation 704 a; a move folder affordance 728 b formoving the respective message in the conversation 704 a from the inboxfolder to another folder; an archive affordance 728 c for archiving therespective message in the conversation 704 a; a reply affordance 728 dfor replying to or forwarding the respective message in the conversation704 a; and a draft affordance 728 e for drafting a new message. In someembodiments, the respective message is the most recent message withinthe conversation 704 a. In some embodiments, the respective message isthe top-most message that is fully displayed within the conversationview 730.

As shown in FIG. 7B, according to some embodiments, a respectivedimension (e.g., the height) of each of the message regions 732 is basedon the amount of content associated with the corresponding message. Forexample, in FIG. 7B, a respective dimension (e.g., the height) of thefirst message region 732 a has a value 733 a, and the respectivedimension (e.g., the height) of the second message region 732 b has avalue 733 b. In this example, the value 733 b is greater than the value733 a because the first message associated with the first message region732 a has less content (e.g., lines of text) than the second messageassociated with the second message region 732 b.

FIGS. 7B-7C illustrate a sequence in which the user scrolls within theconversation view 730. FIG. 7B also illustrates detecting an upwardswipe gesture with a contact 740 within the content region 731 b. FIG.7C illustrates scrolling the message regions 732 within the contentregion 731 b in response to detecting the upward swipe gesture in FIG.7B. FIG. 7C is similar to and adapted from FIG. 7B. As such, FIG. 7B andFIG. 7C include similar user interfaces and elements labeled with thesame reference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. As shown inFIG. 7C, the conversation view 730 no longer includes the subject bar734. However, the header region 731 a includes an indication of thesubject of the conversation 704 a (e.g., Apple Picking”) in addition tothe indication of the number of messages in the conversation 704 a(e.g., 3 messages).

FIGS. 7C-7D illustrate a sequence in which a first set of one or moreaffordances is displayed within the content region 731 b. FIG. 7C alsoillustrates detecting a contact 742 at a location corresponding to theactions affordance 738 c within the second message region 732 b. FIG. 7Dillustrates sliding the second message region 732 b in a first direction(e.g., right-to-left) in response to selection of the actions affordance738 c in FIG. 7C. FIG. 7D also illustrates displaying a first actionregion 744 adjacent to the second message region 732 b, including afirst set of one or more affordances provided to perform actions on thesecond message corresponding to the second message region 732 b inresponse to selection of the actions affordance 738 c in FIG. 7C.

FIG. 7D is similar to and adapted from FIG. 7B. As such, FIG. 7B andFIG. 7D include similar user interfaces and elements labeled with thesame reference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. As shown inFIG. 7D, the first action region 744 includes: a reply affordance 746 a,which, when activated (e.g., with a contact), causes a menu with aplurality of reply options to be overlaid on the conversation view 730(e.g., as shown in FIGS. 7F-7G); a move affordance 746 b, which, whenactivated (e.g., with a contact), causes a menu with a plurality offolder options for moving the second message corresponding to the secondmessage region 732 b to be overlaid on the conversation view 730; and atrash affordance 746 c, which, when activated (e.g., with a contact),causes the second message corresponding to the second message region 732b to be moved to the trash (sometimes referred to collectively as the“affordances 746”). In some embodiments, the first action region 744includes any number of affordances 746. In some embodiments, one or moreof the affordances 746 may be replaced with other action options from apreferences menu.

FIGS. 7E-7F illustrate another sequence in which the first set of one ormore affordances is displayed within the content region 731 b. FIG. 7Eis similar to and adapted from FIG. 7B and FIG. 7D. As such, FIG. 7B,FIG. 7D, and FIG. 7E include similar user interfaces and elementslabeled with the same reference number in both figures have the samefunction, only the differences are described herein for the sake ofbrevity. FIG. 7E illustrates detecting a right-to-left swipe gesturewithin the second message region 732 b with a contact 748. FIG. 7Fillustrates sliding the second message region 732 b in a first direction(e.g., right-to-left) in response to detecting the right-to-left swipegesture in FIG. 7E. FIG. 7F also illustrates displaying a first actionregion 744 adjacent to the second message region 732 b, including thefirst set of one or more affordances provided to perform actions on thesecond message corresponding to the second message region 732 b inresponse to detecting the right-to-left swipe gesture in FIG. 7E.

FIGS. 7F-7G illustrate a sequence in which a menu 751 with a pluralityreply options is overlaid on the conversation view 730. FIG. 7F furtherillustrates detecting a contact 750 at a location corresponding to thereply affordance 746 a within the first action region 744. FIG. 7Gillustrates displaying the menu 751 with a plurality reply optionsoverlaid on the conversation view 730 in response to selection of thereply affordance 746 a in FIG. 7F. According to some embodiments, themenu 751 slides up from the bottom edge of the display area of thedevice 100. As shown in FIG. 7G, the menu 751 includes: a reply to allaffordance 749 a, which, when activated (e.g., with a contact) causes amessage drafting interface for replying to all participants of thesecond message that corresponds to the second message region 732 b toreplace display of the conversation view 730; a reply affordance 749 b,which, when activated (e.g., with a contact) causes a message draftinginterface for replying to the sender of the second message thatcorresponds to the second message region 732 b to replace display of theconversation view 730; a forward affordance 749 c, which, when activated(e.g., with a contact) causes a message drafting interface forforwarding the second message region 732 b to replace display of theconversation view 730; and a cancel affordance 749 d, which, whenactivated (e.g., with a contact) causes the menu 751 to cease beingdisplayed.

FIGS. 7H-7I illustrate a sequence in which in which a second set of oneor more affordances is displayed within the content region 731 b. FIG.7H is similar to and adapted from FIG. 7B. As such, FIG. 7B and FIG. 7Hinclude similar user interfaces and elements labeled with the samereference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. FIG. 7Hillustrates detecting a left-to-right swipe gesture within the secondmessage region 732 b with a contact 754. FIG. 7I illustrates sliding thesecond message region 732 b in a second direction (e.g., left-to-right)in response to detecting the left-to-right swipe gesture in FIG. 7H.FIG. 7I also illustrates displaying a second action region 760 adjacentto the second message region 732 b, including a second set of one ormore affordances provided to perform actions on the second messagecorresponding to the second message region 732 b in response todetecting the left-to-right swipe gesture in FIG. 7H.

As shown in FIG. 7I, the second action region 760 includes an unreadaffordance 762, which, when activated (e.g., with a contact), causes thesecond message corresponding to the second message region 732 b to bemarked as unread. In some embodiments, the second action region 760includes any number of affordances. In some embodiments, the unreadaffordance 762 may be replaced with other action options from apreferences menu.

FIGS. 7J-7K illustrate a sequence in which in which a message view 770replaces display of the conversation view 730. FIG. 7J is similar to andadapted from FIG. 7B. As such, FIG. 7B and FIG. 7J include similar userinterfaces and elements labeled with the same reference number in bothfigures have the same function, only the differences are describedherein for the sake of brevity. FIG. 7J illustrates detecting a contact764 at a location corresponding to the “see more” affordance 738 bwithin the second message region 732 b. FIG. 7K illustrates replacingdisplay of the conversation view 730 with a message view 770 for thesecond message corresponding to the second message region 732 b inresponse to selection of the “see more” affordance 738 c.

As shown in FIG. 7K, the content region 731 b includes the contents 774of the second message that corresponds to the second message region 732b. As shown in FIG. 7K, the header region 731 a includes a backaffordance 716 a, which, when activated (e.g., with a contact), causesthe message view 770 to be replaced with the previous view or pane(e.g., the conversation 750 in FIG. 7J). According to some embodiments,the header region 731 a also includes: a next affordance 726 a, which,when activated (e.g., with a contact), causes a next message from theconversation 704 a to be displayed within the message view 770; and aprevious affordance 726 b, which, when activated (e.g., with a contact),causes a previous message from the conversation 704 a to be displayedwithin the message view 770.

According to some embodiments, the message view 770 for the secondmessage corresponding to the second message region 732 b replacesdisplay of the conversation view 730 in response to detecting a contactwithin the header sub-region 736 a of the second message region 732 b(not shown). According to some embodiments, the message view 770 for thesecond message corresponding to the second message region 732 b replacesdisplay of the conversation view 730 in response to detecting a contactwithin the content sub-region 736 b of the second message region 732 b(not shown).

FIGS. 7L-7P illustrates displaying a dual-pane user interface associatedwith an electronic mail (email) and/or messaging application thatincludes a first pane 7120 and a second pane 7110 within the displayarea of the device 100. As shown in FIG. 7L, the second pane 7110includes a folder view 7140 for an inbox folder that includes electroniccommunications to and/or from the user of the device 100. For example,the electronic communications include email conversations, emailmessages, instant message conversations, instant messages, SMSs, MMSs,talk-to-text, and/or the like. In some embodiments, the user of thedevice 100 is able to select between different groupings of electroniccommunications, such as folders, categories, or tags, to replace theinbox folder view 7140 with a folder view for a different grouping.

As shown in FIG. 7L, the second pane 7110 includes: a back affordance716 a, which, when activated (e.g., with a contact), causes the inboxfolder view 7140 to be replaced with a previous view or pane; and anedit affordance 716 b for marking, moving, and archiving electroniccommunications in the inbox folder. As shown in FIG. 7L, the second pane7110 also includes: a filter affordance 718 a, which, when activated(e.g., with a contact), causes the messages, conversations, and/orbundles associated with the inbox folder to be filtered according to aset of filter criteria or a filter pane to be displayed.

As shown in FIG. 7L, the second pane 7110 further includes a pluralityof rows. In some embodiments, a row represents a plurality of messages(e.g., electronic communications) from the inbox folder that satisfy oneor more conversation criteria (e.g., a conversation with one or moremessages with similar subjects, content, senders, recipients, and/or thelike). In some embodiments, a row represents a single message from theinbox folder.

In FIG. 7L, the first row corresponds to a conversation 704 a (e.g.,with two or more messages). The first row includes: a timestamp of amost recently received message in the conversation 704 a; the sender(s)of messages in the conversation 704 a; the subject of the conversation704 a (e.g., “Apple Picking”); and a blurb/snapshot of the contents ofthe conversation 704 a. In FIG. 7L, the conversation 704 a is displayedin the foreground or “in focus” as indicated by the vertical orientationof the view mode affordance 7111 a and the shading of the first rowwithin the second pane 7110.

As shown in FIG. 7L, the second row corresponds to a message 704 b(e.g., a conversation with one message). The second row includes: atimestamp associated with the message 704 b; the sender of the message704 b; the subject of the message 704 b (e.g., “Sulawesi WeatherReports”); and a blurb/snapshot of the contents of the message 704 b. InFIG. 7L, the message 704 b is displayed in the background as indicatedby the horizontal orientation of the view mode affordance 7111 b and thenon-shading of the second row within the second pane 7110.

As shown in FIG. 7L, the third row corresponds to a message 704 c (e.g.,a conversation with one message). The third row includes: a timestampassociated with the message 704 c; the sender of the message 704 c; thesubject of the message 704 c (e.g., “Dehydration Machine”); and ablurb/snapshot of the contents of the message 704 c.

In FIG. 7L, the fourth row corresponds to a conversation 704 d (e.g.,with two or more messages). The fourth row includes: a timestamp of amost recently received message in the conversation 704 d; the sender(s)of messages in the conversation 704 d; the subject of the conversation704 d (e.g., “Battle of Leyte Gulf”); and a blurb/snapshot of thecontents of the conversation 704 d.

As shown in FIG. 7L, the first pane 7120 includes a conversation view7150 of the conversation 704 a, which is displayed in the foreground inthe second pane 7110. In FIG. 7L, the first pane 7120 includes: a firstmessage region 732 a associated with a first message in the conversation704 a; a second message region 732 b associated with a second message inthe conversation 704 a; and a portion of a third message region 732 cassociated with a third message in the conversation 704 a (sometimescollectively referred to as the “message regions 732”). For example, ifa user scrolls within the first pane 7120, the balance of the thirdmessage region 732 c is displayed.

As shown in FIG. 7L, the message regions 732 include a header sub-region736 a, a content sub-region 736 b, and a bottom sub-region 736 c. Theheader sub-region 736 a includes the sender of the correspondingmessage, the recipients of the corresponding message, the folderassociated with the corresponding message, a timestamp for thecorresponding message, and a “details” affordance 738 a, which, whenactivated (e.g., with a contact), causes additional details associatedwith a corresponding message to be displayed within the headersub-region 736 a. The content sub-region 736 b includes the content ofthe corresponding message. The bottom sub-region 736 c includes: a “seemore” affordance 738 b, which, when activated (e.g., with a contact),causes a message view of the corresponding message to replace display ofthe conversation view 7150 within the first pane 7120; and an actionsaffordance 738 c, which, when activated (e.g., with a contact), causes afirst set of one or more affordances to be displayed (e.g., similar toFIG. 7M).

As shown in FIG. 7L, according to some embodiments, a respectivedimension (e.g., the height) of each of the message regions 732 is basedon the amount of content for the corresponding message. For example, inFIG. 7L, a respective dimension (e.g., the height) of the first messageregion 732 a has a value 733 a, and the respective dimension (e.g., theheight) of the second message region 732 b has a value 733 b. In thisexample, the value 733 b is greater than the value 733 a because thefirst message associated with the first message region 732 a has lesscontent (e.g., lines of text) than the second message associated withthe second message region 732 b.

FIGS. 7L-7M illustrate a sequence in which a first set of one or moreaffordances is displayed within the first pane 7120. FIG. 7L alsoillustrates detecting a right-to-left swipe gesture within the firstmessage region 732 a with a contact 7122. FIG. 7M illustrates slidingthe first message region 732 a in a first direction (e.g.,right-to-left) in response to detecting the right-to-left swipe gesturein FIG. 7L. FIG. 7M also illustrates displaying a first action region744 adjacent to the first message region 732 a, including a first set ofone or more affordances provided to perform actions on the first messagecorresponding to the first message region 732 a in response to detectingthe right-to-left swipe gesture in FIG. 7L.

FIG. 7M is similar to and adapted from FIG. 7D. As such, FIG. 7D andFIG. 7M include similar user interfaces and elements labeled with thesame reference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. As shown inFIG. 7M, the first action region 744 includes: a reply affordance 746 a,a move affordance 746 b, and a trash affordance 746 c (sometimesreferred to collectively as the “affordances 746”). In some embodiments,the first action region 744 includes any number of affordances. In someembodiments, one or more of the affordances 746 may be replaced withother action options from a preferences menu.

FIGS. 7N-7O illustrate a sequence in which a second set of one or moreaffordances is displayed within the first pane 7120. FIG. 7N illustratesdetecting a left-to-right swipe gesture within the first message region732 a with a contact 7130. FIG. 7I illustrates sliding the first messageregion 732 a in a second direction (e.g., left-to-right) in response todetecting the left-to-right swipe gesture in FIG. 7N. FIG. 7O alsoillustrates displaying a second action region 760 adjacent to the firstmessage region 732 a, including a second set of one or more affordancesprovided to perform actions on the first message corresponding to thefirst message region 732 a in response to detecting the left-to-rightswipe gesture in FIG. 7N.

FIG. 7N is similar to and adapted from FIG. 7L. As such, FIG. 7L andFIG. 7N include similar user interfaces and elements labeled with thesame reference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. FIG. 7O issimilar to and adapted from FIG. 7I. As such, FIG. 7O and FIG. 7Iinclude similar user interfaces and elements labeled with the samereference number in both figures have the same function, only thedifferences are described herein for the sake of brevity. As shown inFIG. 7O, the second action region 760 includes an unread affordance 762,which, when activated (e.g., with a contact), causes the first messagecorresponding to the first message region 732 a to be marked as unread.In some embodiments, the second action region 760 includes any number ofaffordances. In some embodiments, the unread affordance 762 may bereplaced with other action options from a preferences menu.

FIGS. 7O-7P illustrate a sequence in which in which a message view 7160replaces display of the conversation view 7150 within the first pane7120. FIG. 7O further illustrates detecting a contact 7142 at a locationcorresponding to the second row within the second pane 7120 thatcorresponds to the message 704 b. FIG. 7P illustrates replacing displayof the conversation view 7150 within the first pane 7120 with a messageview 7160 for the message 704 b in response to selection of the message704 b within the first pane 7120 in FIG. 7O.

As shown in FIG. 7P, the message view 7160 includes the contents 7162 ofthe message 704 b. In FIG. 7P, the conversation 704 a is displayed inthe background as indicated by the horizontal orientation of the viewmode affordance 7111 a and the non-shading of the first row within thesecond pane 7110. In FIG. 7L, the message 704 b is displayed in theforeground or “in focus” as indicated by the vertical orientation of theview mode affordance 7111 b and the shading of the second row within thesecond pane 7110.

FIGS. 8A-8C illustrate a flow diagram of a method 800 of bundlingelectronic communications in accordance with some embodiments. Themethod 800 is performed at an electronic device (e.g., the portablemultifunction device 100 in FIG. 1A, or the device 300 in FIG. 3) with aone or more processors, non-transitory memory, a display, and an inputdevice. In some embodiments, the display is a touch-screen display andthe input device is on or integrated with the display. In someembodiments, the display is separate from the input device. Someoperations in method 800 are, optionally, combined and/or the order ofsome operations is, optionally, changed.

As described below, the method 800 provides an intuitive way to bundleelectronic communications. The method reduces the cognitive burden on auser when bundling electronic communications, thereby creating a moreefficient human-machine interface. For battery-operated electronicdevices, enabling a user to bundle electronic communications faster andmore efficiently conserves power and increases the time between batterycharges.

The device displays (802), on the display, an inbox view of a messagingapplication that includes a plurality of rows representing electroniccommunications, the plurality of rows including a first row representinga first plurality of messages that satisfy one or more conversationcriteria that indicate that each of the first plurality of messages area part of a same respective conversation, and a second row representinga second plurality of messages that satisfy a first category criterionbut are not part of a same conversation. In some embodiments, theelectronic communications include email conversations, email messages,instant message conversations, instant messages, SMSs, MMSs,talk-to-text, and/or the like. In some embodiments, the inbox viewcorresponds to a grouping of electronic communications such as a firstfolder (e.g., inbox, drafts, sent, junk, trash, all mail, or a customfolder) or a first tag. In some embodiments, the one or moreconversation criteria are satisfied when messages have a same group ofparticipants, a same subject line, similar content, and/or the like.

For example, the second plurality of messages is a bundle of messagesthat correspond to a first bundling category (e.g., the first categorycriterion) in a condensed view mode. In some embodiments, the secondplurality of messages do not satisfy the one or more conversationcriteria. Thus, the second plurality of messages are not part of a sameconversation. In some embodiments, a third plurality of messagesrepresented by a third row satisfy a second bundling category (e.g., thesecond category criterion) but do satisfy neither the one or moreconversation criteria nor the first bundling category. In someembodiments, the inbox view includes an arbitrary number of rows. Insome embodiments, an arbitrary number of rows among the plurality ofrows in the inbox view represent conversations. In some embodiments, anarbitrary number of rows among the plurality of rows in the inbox viewrepresent bundles of messages. As such, according to some embodiments,the inbox view includes rows for both conversations and bundles ofmessages, which provides the user with a more intuitive and lesscluttered interface by reducing the amount of room taken up by bulkmessages in the list of messages and enabling the user to see more ofthe non-bulk messages without scrolling the list of message.

As one example, FIG. 5A shows a folder view 502 associated with an inboxfolder for an electronic mail (email) and/or messaging applicationwithin the display area 501 of the device 100. In FIG. 5A, the inboxfolder view 502 includes a plurality of rows in condensed view mode,including: a first row that corresponds to a conversation 504 a (e.g.,with two messages); a second row that corresponds to a bundle ofmessages 504 b that satisfy an updates criterion 515; and a third rowthat corresponds to a conversation 504 c (e.g., with a single message).

As another example, FIG. 5N shows a user interface for an electronicmail (email) and/or messaging application within the display area 501 ofthe device 100. In FIG. 5N, the user interface includes a folders pane5110 and a content pane 5120. As shown in FIG. 5N, the folders pane 5110includes: a first row that corresponds to a conversation 5112 a (e.g.,with one message); a second row that corresponds to a bundle of messages5112 b that satisfy a travel criterion 5115 a; a third row thatcorresponds to a conversation 5112 c (e.g., with one message); and afourth row that corresponds to a bundle of messages 5112 d that satisfya fashion criterion 5115 b.

In some embodiments, the plurality of rows in the inbox view is sorted(804) by date, and the second row representing the plurality of messagesis included in the inbox view based on a date of a most recentlyreceived message among the plurality of messages. For example, withreference to FIG. 5A, the conversation 504 a represented by the firstrow includes a message with a more recent timestamp than the messagesincluded in the bundle of messages 504 b represented by the second row.However, continuing with this example, the bundle of messages 504 brepresented by the second row includes a message with a more recenttimestamp than the message included in the conversation 504 crepresented by the third row.

In some embodiments, the first category criterion corresponds to (806)one of a sender type of the second plurality of messages or a contenttype of the second plurality of messages. As one example, with referenceto FIG. 5A, messages included in the bundle of messages 504 b satisfythe updates criterion 515 (e.g., messages associated with social mediaupdates, posts, responses, comments, etc.). As another example, withreference to FIG. 5N, messages included in the bundle of messages 5112 bsatisfy the travel criterion 5115 a (e.g., messages with content relatedto travel, hotels, airplane tickets, etc.).

In some embodiments, the first category criterion is a promotionscriterion for bulk messages sent by a company en masse that are intendedto advertise a product or service. For example, a message from aretailer advertising a suit sale, a message from an airline companyadvertising a one-day sale on airline fares, and a message from avacation rental company advertising last minute vacation home rentalsare organized into a bundle that satisfies the promotions criterion. Insome embodiments, the first category criterion is a newsletterscriterion for bulk messages sent by an entity en masse that disseminateperiodic information or updates. For example, messages from the dean oradministration of a user's school, periodic messages associated withblogs to which the user is subscribed and periodic messages fromassociations to which the user is a member (e.g., AARP, AAA, barassociation, etc.) are organized into a bundle that satisfies thenewsletters criterion.

In some embodiments, the first category criterion is a reservationscriterion for machine-generated messages associated with an upcomingevent for the user. For example, messages associated with an upcomingdinner reservation, an upcoming airplane flight, an upcoming hotel stay,and/or the like are organized into a bundle that satisfies thereservations criterion. In some embodiments, the first categorycriterion is a purchases criterion for machine-generated messagesassociated with purchases made by the user. For example, messagesassociated with online purchases, ride share receipts, shippingnotifications, and/or the like are organized into a bundle thatsatisfies the purchases criterion. In some embodiments, the firstcategory criterion is a finance criterion for machine-generated messagesassociated with financial accounts or transactions. For example,messages associated with person-to-person payments and paymentsrequests, bills, credit card statements, bank statements, banktransactions, brokerage notifications and prospectuses, and/or the likeare organized into a bundle that satisfies the finance criterion.

In some embodiments, the first category criterion is a social activitycriterion for machine-generated messages related to activity on socialmedia networks, online dating services, media-sharing services, and/orthe like. For example, messages associated with contact/friend requests,postings, comments, personal messages, photo tags, etc. are organizedinto a bundle that satisfies the social activity criterion. In someembodiments, the first category criterion is a notifications criterionfor machine-generated messages associated with updates not covered byother bundling criteria. For example, messages associated with accountsecurity such as unidentified login attempts, credit card fraud alerts,password resets, and/or the like are organized into a bundle thatsatisfies the notifications criterion. In some embodiments, the firstcategory criterion corresponds to bulk/spam email messages.

In some embodiments, the second row is displayed (808) in a condensedview mode prior to detecting the user input. As one example, in FIG. 5A,the second row representing the bundle of messages 504 b is displayed inthe condensed view mode. According to some embodiments, the horizontalorientation of the chevrons associated with the view mode affordance 514b, in FIG. 5A, indicate that the second row representing the bundle ofmessages 504 b is displayed in the condensed view mode. As anotherexample, in FIG. 5N, the second row in the folders pane 5110representing the bundle of messages 5112 b is displayed in the condensedview mode. According to some embodiments, the horizontal orientation ofthe chevrons associated with the view mode affordance 5114 b, in FIG.5N, indicate that the second row representing the bundle of messages5112 b is displayed in the condensed view mode. As such, according tosome embodiments, when displayed in the condensed mode, the rows occupyless space while still conveying important information regarding themessages represented by the rows, which provides the user with a moreintuitive and less cluttered interface by informing the user of thenumber and status of the messages in the row, that will help a userdecide whether or not to expand the row to view the messages in the row.

In some embodiments, the condensed view mode includes (810) one or moreof an indication of the first category, one or more senders of theplurality of messages represented by the second row, an indication of amost recently received message among the plurality of messagesrepresented by the second row (e.g., timestamp and/or blurb), anindication of a count of the plurality of messages represented by thesecond row, or an indication of a count of the unread messages among theplurality of messages represented by the second row. As one example, inFIG. 5A, the second row representing the bundle of messages 504 bincludes: a timestamp of a most recently received message in the bundleof messages 504 b; the sender(s) of messages in the bundle of messages504 b; and a messages affordance 517 indicating the total number ofmessages included in the bundle of messages 504 b received today and thenumber of unread messages included in the bundle of messages 504 b. Asanother example, in FIG. 5N, the second row representing the bundle ofmessages 5112 b includes: a timestamp of a most recently receivedmessage in the bundle of messages 5112 b; the sender(s) of messages inthe bundle of messages 5112 b; and a messages affordance 5117 aindicating the total number of messages included in the bundle ofmessages 5112 b received today and the number of unread messagesincluded in the bundle of messages 5112 b.

In some embodiments, the second plurality of messages represented by thesecond row are not displayed (812) in the inbox view while the secondrow is displayed in the condensed view mode. For example, while in thecondensed view mode in FIG. 5A, the second row representing the bundleof messages 504 b includes a timestamp of a most recently receivedmessage in the bundle of messages 504 b and at least some of thesender(s) of messages in the bundle of messages 504 b, but does notinclude the second plurality of messages.

In some embodiments, the second row includes (814) a view modeaffordance provided to toggle between the condensed view mode and anexpanded view mode of the second row. As one example, in FIG. 5A, thefirst row representing the conversation 504 a includes a view modeaffordance 514 b, which, when activated (e.g., with a contact), causesthe second row to change from the condensed view mode to an expandedview mode (e.g., as shown in FIGS. 5B-5C). Similarly, in FIG. 5A, thesecond row representing the bundle of messages 504 b includes a viewmode affordance 514 b, which, when activated (e.g., with a contact),causes the second row to change from the condensed view mode to anexpanded view mode (e.g., as shown in FIGS. 5E-5F). And, in FIG. 5A, thethird row representing the conversation 504 c includes a view modeaffordance 514 c, which, when activated (e.g., with a contact), causesthe third row to change from the condensed view mode to an expanded viewmode.

The device detects (816) an input, via the input device, correspondingto selection of a respective row from among the plurality of rows in theinbox view. As one example, FIG. 5A shows a contact 520 detected at alocation corresponding to the view mode affordance 514 a. As anotherexample, FIG. 5D shows a contact 550 detected at a locationcorresponding to the view mode affordance 514 b. As yet another example,FIG. 5N shows a contact 6124 detected at a location corresponding to theview mode affordance 5114 b. As yet another example, FIG. 6A shows thefocus selector 603 at a location corresponding to the view modeaffordance 616 a.

In response to detecting the input, and in accordance with adetermination that the respective row corresponds to the first row, thedevice displays (820), on the display, additional informationcorresponding to two or more messages from the conversation of relatedmessages that are represented by the first row. According to someembodiments, the device displays two or messages included in theconversation of related messages. In some embodiments, the two or moremessages from the conversation replace the inbox view. In someembodiments, the two or more messages from the conversation aredisplayed inline in the inbox view. In some embodiments, the two or moremessages are displayed in an adjacent content pane. As such, accordingto some embodiments, the user is able to easily view/access additionalinformation (e.g., an expanded view) corresponding to the first rowwithout unnecessarily cluttering the inbox view.

As one example, in FIG. 5B, the inbox folder view 502 is replaced with aconversation view 532 with messages 534 a and 534 b included in theconversation 504 a in response to selection of the view mode affordance514 a in FIG. 5A. As another example, in FIG. 5C, the messages 534 a and534 b included in the conversation 504 a are displayed inline in theinbox folder view 502 in response to selection of the view modeaffordance 514 a in FIG. 5A. As yet another example, in FIG. 6B, thecontent 622 in the content pane 620 is replaced with the messages 632 aand 632 b included in the conversation 612 a in response to selection ofthe view mode affordance 616 a in FIG. 6A.

In response to detecting the input, and in accordance with adetermination that the respective row corresponds to the second row, thedevice displays (822), on the display, additional informationcorresponding to two or more messages from among the second plurality ofmessages that are represented by the second row, including a firstmessage and a second message that both satisfy the first categorycriterion but not part of a same conversation. According to someembodiments, input toggles the view mode of the bundle of messages froma condensed view mode to an expanded view mode. As such, according tosome embodiments, the user is able to easily view/access additionalinformation (e.g., an expanded view) corresponding to the second rowwithout unnecessarily cluttering the inbox view. In some embodiments,the first message is part of a first conversation and the second messageis part of a second conversation that is different from the firstconversation. As such, in some embodiments, the first and secondmessages are associated with different conversations. In someembodiments, the first and second messages have different senders orparticipants. In some embodiments, the first and second messages do notinclude overlapping content.

In some embodiments, the two or more messages included in the bundle ofmessages replaces the inbox view. In some embodiments, the two or moremessages included in the bundle of messages are displayed inline in theinbox view. In some embodiments, the two or more messages included inthe bundle of messages are displayed in an adjacent content pane.

As one example, in FIG. 5E, the inbox folder view 502 is replaced with abundle view 552 in response to detecting selection of the view modeaffordance 514 b in FIG. 5D. As another example, in FIG. 5F, themessages 554 a, 554 b, and 554 c included in the bundle of messages 504b are displayed inline in the inbox folder view 502 in response todetecting selection of the view mode affordance 514 b in FIG. 5D. Asanother example, in FIG. 5O, the content 5122 displayed in the contentpane 5120 is replaced with the message 5132 a, the sub-bundle ofmessages 5132 b, and the message 5132 c included in the bundle ofmessages 5112 b in response to selection of the view mode affordance5114 b in FIG. 5N.

In some embodiments, the additional information corresponding to the twoor more messages from the conversation of related messages that arerepresented by the first row is displayed (824) inline in the inboxview, and the additional information corresponding to the two or moremessages from among the plurality of messages that are represented bythe second row is displayed inline in the inbox view. According to someembodiments, the device maintains display of at least a portion of thefirst and second rows, and the device displays the additionalinformation as rows in the inbox view. As such, according to someembodiments, the user is able to easily view/access additionalinformation (e.g., an expanded view) corresponding to the second rowinline, which provides the user with a more intuitive and less clutteredinterface. As one example, in FIG. 5C, the messages 534 a and 534 b(e.g., the additional information) included in the conversation 504 aare displayed inline in the inbox folder view 502. As another example,in FIG. 5F, the messages 554 a, 554 b, and 554 c (e.g., the additionalinformation) included in the bundle of messages 504 b are displayedinline in the inbox folder view 502.

In some embodiments, the additional information corresponding to the twoor more messages from the conversation of related messages that arerepresented by the first row replaces display of (826) the inbox view,and the additional information corresponding to the two or more messagesfrom among the plurality of messages that are represented by the secondrow replaces display of the inbox view. According to some embodiments,the device replaces display of the inbox view with the two or moremessages corresponding to the conversation or the two or more messagesfrom the bundle of messages. As such, according to some embodiments, theuser is able to easily view/access additional information (e.g., anexpanded view) corresponding to the second row in a new interface thatreplaces the inbox view, which provides the user with a more intuitiveand less cluttered interface. As one example, in FIG. 5B, the inboxfolder view 502 is replaced with a conversation view 532 that includesthe messages 534 a and 534 b (e.g., the additional information) from theconversation 504 a. As another example, in Figure in FIG. 5E, the inboxfolder view 502 is replaced with a bundle view 552 that includes themessages 554 a, 554 b, and 554 c (e.g., the additional information) fromthe bundle of messages 504 b.

In some embodiments, the additional information corresponding to the twoor more messages from the conversation of related messages that arerepresented by the first row is displayed (828) in a content paneseparate from the inbox view displayed in an inbox pane, and theadditional information corresponding to the two or more messages fromamong the plurality of messages that are represented by the second rowis displayed in the content pane separate from the inbox view displayedin the inbox pane. According to some embodiments, the device maintainsdisplay of the inbox view in the inbox pane and displays the additionalinformation in the separate content pane. As such, according to someembodiments, the user is able to easily view/access additionalinformation (e.g., an expanded view) corresponding to the second row ina separate content pane, which provides the user with a more intuitiveand less cluttered interface. As one example, in FIG. 6B, the devicemaintains display of the folders pane 610 and replaces display of thecontent 622 in the content pane 620 with the messages 632 a and 632 b(e.g., the additional information) from the conversation 612 a. Asanother example, in FIG. 5O, the device maintains display of the folderspane 5110 and replaces display of the content 5122 in the content pane5120 with the message 5132 a, the sub-bundle of messages 5132 b, and themessage 5132 c (e.g., the additional information) from the bundle ofmessages 5112 b.

In some embodiments, the two or more messages from among the pluralityof messages that are represented by the second row include (830) asubset of the plurality of messages selected based on a predeterminedcriterion. In some embodiments, the first and second messages are themost recent messages in the second plurality of messages. In someembodiments, the first and second messages are the most recent messagesreceived today. In some embodiments, the first and second messages arethe most recent unread messages. some embodiments, the first and secondmessages are the most recent messages received from VIP contacts (e.g.,a list of specific contacts). In some embodiments, the first and secondmessages are the most recent messages from the user's most frequentcontacts.

In some embodiments, the user input corresponds to (832) selection ofthe view mode affordance, and the second row is displayed in theexpanded view mode after detecting the user input. In some embodiments,the expanded view shows a limited number of the second plurality ofmessages in the bundle of messages based on the category criterion. Asone example, in FIG. 5F, the second row representing the bundle ofmessages 504 b is displayed in the expanded view mode in response toselection of the view mode affordance 514 b in FIG. 5D. For example, thehorizontal orientation of the chevrons associated with the view modeaffordance 514 b in FIG. 5D indicate that the second row representingthe bundle of messages 504 b is displayed in the condensed view mode,and the vertical orientation of the chevrons associated with view modeaffordance 514 b in FIG. 5F indicate that the second row representingthe bundle of messages 504 b is displayed in the expanded view mode.

As another example, in FIG. 5O, the second row representing the bundleof messages 5112 b is displayed in the expanded view mode in response toselection of the view mode affordance 5114 b in FIG. 5N. For example,the horizontal orientation of the chevrons associated with the view modeaffordance 5114 b in FIG. 5N indicate that the second row representingthe bundle of messages 5112 b is displayed in the condensed view mode,and the vertical orientation of the chevrons associated with view modeaffordance 5114 b in FIG. 5O indicate that the second row representingthe bundle of messages 5112 b is displayed in the expanded view mode.

In some embodiments, the expanded view mode includes (834) an affordanceprovided to display the plurality of messages different from the two ormore messages. In some embodiments, the expanded view of the bundle ofmessages represented by the second row includes: X unread messages orthe X most recent messages, and an affordance for viewing all messagesinclude in bundle of messages. In some embodiments, the expanded viewmode shows a limited number of the second plurality of messages, and thebalance of the second plurality of the messages are viewable byselecting the affordance. In some embodiments, the two or more messagesinclude the second plurality of messages.

As one example, in FIG. 5E, the bundle view 552 includes a messagesaffordance 517, which, when activated (e.g., with a contact), causesdisplay of the unread messages included in the bundle of messages 504 bor all messages included in the bundle of messages 504 b. As anotherexample, in FIG. 5F, the messages affordance 517 is displayed in theinbox folder view 502.

As yet another example, in FIG. 5O, the content pane 5120 includes amessages affordance 5117 a, which, when activated (e.g., with acontact), causes display of the unread messages included in the bundleof messages 5112 b or all messages included in the bundle of messages5112 b. Continuing with this example, in FIG. 5P, the content pane 5120displays all messages included in the bundle of message 5112 b inresponse to selection of the messages affordance 5117 a in FIG. 5O.

In some embodiments, the expanded view of the bundle of messagesrepresented by the second row includes: X unread or the X most recentmessages, an affordance for viewing all messages include in bundle ofmessages, and a sub-bundle associated with a sub-category criterion in acondensed view. As one example, in FIG. 5Q, a row representing asub-bundle of messages 5132 b that satisfy the travel criterion 5115 aand also a Europe sub-criterion 5131 (e.g., messages with contentrelated to European travel, hotels, airplane tickets, etc.) is displayedinline in the folders pane 5110. Continuing with this example, in FIG.5R, additional information (e.g., the conversations/messages 5142 a and5142 b) for the sub-bundle of messages 5132 b is displayed inline in theinbox folder pane 5110 and the content 5144 for the conversation/message5142 a is displayed in the content pane 5120 in response to selection ofthe view mode affordance 5134 b in FIG. 5Q. For example, the horizontalorientation of the chevrons associated with the view mode affordance5134 b in FIG. 5Q indicate that the row representing the sub-bundle ofmessages 5132 b is displayed in the condensed view mode, and thevertical orientation of the chevrons associated with view modeaffordance 5134 b in FIG. 5R indicate that the second row representingthe sub-bundle of messages 5132 b is displayed in the expanded viewmode.

In some embodiments, the inbox view of the messaging applicationincludes (836) a third row representing a third plurality of messagesthat satisfy a second category criterion different from the firstcategory criterion. In some embodiments, the second category criterioncorresponds to one of a sender type of the third plurality of messagesor a content type of the third plurality of messages. For example, FIG.5N shows a user interface for an electronic mail (email) and/ormessaging application within the display area 501 of the device 100. InFIG. 5N, the user interface includes a folders pane 5110 and a contentpane 5120. As shown in FIG. 5N, the folders pane 5110 includes: a firstrow that corresponds to a conversation 5112 a (e.g., with one message);a second row that corresponds to a bundle of messages 5112 b thatsatisfy a travel criterion 5115 a (e.g., the first category criterionalso herein called the first bundling criteria); a third row thatcorresponds to a conversation 5112 c (e.g., with one message); and afourth row that corresponds to a bundle of messages 5112 d that satisfya fashion criterion 5115 b (e.g., the second category criterion alsoherein called the second bundling criteria).

In some embodiments, the inbox view is included in an inbox pane, andthe device displays (838), on the display, a content pane adjacent tothe inbox pane, where the content pane includes information associatedwith the conversation of related messages represented by the first rowor the plurality of messages represented by the second row. For example,FIG. 5Q shows a user interface for an electronic mail (email) and/ormessaging application within the display area 501 of the device 100. InFIG. 5Q, the user interface includes a folders pane 5110 and a contentpane 5120. As shown in FIG. 5N, the folders pane 5110 corresponds to aninbox folder that includes electronic communications to and/or from theuser of the device 100. In FIG. 5Q, the folders pane 5110 includes asecond row that corresponds to a bundle of messages 5112 b that satisfythe travel criterion 5115 a, and the content pane 5120 includes content5138 for the conversation/message 5132 a included in the bundle ofmessages 5112 b.

In some embodiments, the content pane includes (840) an indication thatthe information included in the content pane corresponds to theplurality of messages that do not meet the one or more conversationcriteria represented by the second row. In some embodiments, the contentpane includes a badge corresponding to the bundling category. In someembodiments, the content pane includes a stack of overlapping messagesfrom the bundle of messages. For example, in FIG. 5Q, the content pane5120 includes an indicator (e.g., a badge or text description) of thetravel criterion 5115 a. For example, in FIG. 5Q, the conversation 5132a is displayed as a top message in a stack of messages 5139 associatedwith the bundle of messages 5112 b that satisfy the travel criterion5115 a.

In some embodiments, the information included in the content pane has(842) a different appearance for the plurality of messages that do notmeet the one or more conversation criteria (e.g., stacked and obscuringeach other), the conversation of related messages (e.g., displayedadjacent to each other and separated by message delimiters such asspaces or borders), and a message (e.g., displayed by itself). As oneexample, in FIG. 5Q, the messages/conversations associated with thebundle of messages 5112 b are displayed in a stack of messages 5139 inthe content pane 5120 with the content 5138 of the conversation 5132 adisplayed on the top of the stack of messages 5139. As another example,in FIG. 6B, rows representing the messages 634 a and 634 b included inthe conversation 612 a are displayed in the content pane 620. As yetexample, in FIG. 5N, the content 5122 of the messages/conversation 5122a is displayed in the content pane 5120.

It should be understood that the particular order in which theoperations in FIGS. 8A-8C have been described is merely example and isnot intended to indicate that the described order is the only order inwhich the operations could be performed. One of ordinary skill in theart would recognize various ways to reorder the operations describedherein. Additionally, it should be noted that details of other processesdescribed herein with respect to other methods described herein (e.g.,methods 900 and 1000) are also applicable in an analogous manner tomethod 800 described above with respect to FIGS. 8A-8C. For example, thecontacts, gestures, user interface objects, and focus selectorsdescribed above with reference to method 800 optionally have one or moreof the characteristics of the contacts, gestures, user interfaceobjects, and focus selectors described herein with reference to othermethods described herein (e.g., methods 900 and 1000). For brevity,these details are not repeated here.

FIGS. 9A-9C illustrate a flow diagram of a method 900 of filteringelectronic communications in accordance with some embodiments. Themethod 900 is performed at an electronic device (e.g., the portablemultifunction device 100 in FIG. 1A, or the device 300 in FIG. 3) with aone or more processors, non-transitory memory, a display, and an inputdevice. In some embodiments, the display is a touch-screen display andthe input device is on or integrated with the display. In someembodiments, the display is separate from the input device. Someoperations in method 900 are, optionally, combined and/or the order ofsome operations is, optionally, changed.

As described below, the method 900 provides an intuitive way to filterelectronic communications. The method reduces the cognitive burden on auser when filtering electronic communications, thereby creating a moreefficient human-machine interface. For battery-operated electronicdevices, enabling a user to filter electronic communications faster andmore efficiently conserves power and increases the time between batterycharges.

The device concurrently displays (902), on the display, a plurality ofrepresentations of electronic communications associated with a firstgrouping (e.g., a first folder or first tag), and a filter affordance(e.g., a filter icon within a portion of a title bar or chrome region)that corresponds to a set of one or more filter criteria. In someembodiments, the electronic communications include email conversations,email messages, instant message conversations, instant messages, SMSs,MMSs, talk-to-text, and/or the like.

As one example, FIG. 5A shows a folder view 502 associated with an inboxfolder for an electronic mail (email) and/or messaging applicationwithin the display area 501 of the device 100. In FIG. 5A, the inboxfolder view 502 includes a plurality of rows representing a conversation504 a (e.g., with two messages), a bundle of messages 504 b that satisfyan updates criterion 515, a conversation 504 c (e.g., with a singlemessage), and a conversation 504 d (e.g., with a single message). InFIG. 5A, the inbox folder view 502 also includes a filter affordance 518a.

As another example, FIG. 5N shows a user interface for an electronicmail (email) and/or messaging application within the display area 501 ofthe device 100. In FIG. 5N, the user interface includes a folders pane5110 and a content pane 5120. As shown in FIG. 5N, the folders pane 5110includes rows representing a conversation 5112 a (e.g., with onemessage), a bundle of messages 5112 b that satisfy a travel criterion5115 a, a conversation 5112 c (e.g., with one message), and a bundle ofmessages 5112 d that satisfy a fashion criterion 5115 b. In FIG. 5N, thefolders pane 5110 also includes the filter affordance 518 a. As shown inFIG. 5N, the content pane 5120 includes content 5122 for theconversation 5112 a.

As yet another example, FIG. 6A shows a window 602 for an electronicmail (email) and/or messaging application within the display area 601that includes a folders pane 610 and a content pane 620. As shown inFIG. 6A, the folders pane 610 includes rows representing a conversation612 a (e.g., with two or more messages), a conversation 612 b (e.g.,with one message), a conversation 612 c (e.g., with one message), aconversation 612 d (e.g., with one message), a conversation 612 e (e.g.,with one message), and a conversation 612 a (e.g., with one message)(partially occluded). In FIG. 6A, the folders pane 610 also includes thefilter affordance 616 b. As shown in FIG. 6A, the content pane 620includes content 622 for the conversation 612 b.

In some embodiments, satisfying a respective criterion from among theset of one or more filter criteria includes (904) determining thatelectronic communications associated with the second set ofrepresentations of electronic communications are categorized asimportant based on past user actions with electronic communications. Insome embodiments, a message is automatically categorized or identifiedas important when the message is sent by a VIP sender (e.g., a sender ona list of specified senders) or the user frequently communicates withthe sender. In some embodiments, a message is automatically categorizedor identified as important when the message is starred or marked as anurgent message. In some embodiments, a message is automaticallycategorized or identified as important when the message is sent in replyto a starred or urgent message. In some embodiments, a message isautomatically categorized or identified as important when the message issent directly or only to the user (e.g., the message is not a bulk/spammessage and the message is not associated with a list server or asubscription). In some embodiments, a message is automaticallycategorized or identified as important when the message has a subject orcontent that includes one or more words that match a list of predefinedwords (e.g., urgent, important, time sensitive, etc.). As one example,in FIG. 5I, the filters pane 582 includes the important filter 586 b. Asanother example, in FIG. 6C, the filters menu 640 includes the importantfilter 642 b.

While concurrently displaying the plurality of representations ofelectronic communications and the filter affordance, the device detects(906) a selection input, via the input device, that corresponds toselection of the filter affordance. As one example, FIG. 5H showsselection of the filter affordance 518 a with a contact 580. As anotherexample, FIG. 5K shows selection of the filter affordance 518 a with acontact 596.

In response to detecting the selection input, and in accordance with adetermination that the selection input corresponds to a first input type(e.g., a one finger tap, a one finger light press gesture, a singleclick with a focus selector, or the like), the device (908): ceases todisplay a first set of representations of electronic communications(e.g., the first set representations corresponds to one or moreelectronic communications) from among the plurality of representationsof electronic communications associated with the first grouping that donot match the set of one or more filter criteria; displays a second setof representations of electronic communications (e.g., the second setrepresentations corresponds to one or more electronic communications)from among the plurality of representations of electronic communicationsassociated with the first grouping that match the set of one or morefilter criteria; and displays an indication of the set of one or morefilter criteria that have been applied to the electronic communicationsassociated with the first grouping. As such, according to someembodiments, the user is able to quickly filter the first grouping toprovide a more tailored interface that is less cluttered and includesmore of the messages that the user wants to see and fewer of themessages that the user has elected to filter out, while still providingthe user with a simple way to view the messages that have been filteredout.

In some embodiments, ceasing to display the first set of representationsincludes eliding a subset of the previously displayed plurality ofrepresentations of electronic communications associated with the firstgrouping that do not match the set of one or more filter criteria. Insome embodiments, displaying the second set of representations includesmaintaining display of a subset of the previously displayed plurality ofrepresentations of electronic communications associated with the firstgrouping that match the filter criteria. In some embodiments, the set ofone or more filter criteria will continue to apply to the first groupinguntil the user of the device again selects the filter affordance totoggle off the set of one or more filter criteria. For example, the setof one or more filter criteria will continue to apply even if the userof the device selects a second grouping.

As one example, FIG. 5L shows the filtered inbox folder view 5114 inresponse to the selection input of the filter affordance 518 a in FIG.5K that corresponds to the first input type (e.g., a one finger tapgesture). According to some embodiments, each of the rows in thefiltered inbox folder view 5114 in FIG. 5L represents one or moremessages (e.g., a bundle of messages, or a conversation with a singlemessage or a plurality of messages) that satisfy the set of filtercriteria (e.g., the important filter 586 b and the unread filter 586 e).

As another example, FIG. 6D shows the filtered inbox folder in thefolders pane 610 in response to the selection input of the filteraffordance 616 b in FIG. 6B that corresponds to the first input type(e.g., a single click with the focus selector 603). According to someembodiments, each of the rows of the filtered inbox folder within thefolders pane 610 in FIG. 6D represents a conversation that satisfies theset of filter criteria (e.g., the flagged filter 642 d).

In some embodiments, the indication of the set of one or more filtercriteria includes (910) a description of the set of one or more filtercriteria adjacent to the filter affordance. In some embodiments, theindication includes a text description of the set of filters applied tothe current folder as shown in FIGS. 5L and 6D. In some embodiments, theindication includes one or more distinct icons for t the set of filtersapplied to the current folder. As one example, in FIG. 5L, the filteredinbox folder view 5114 includes an indication 598 of the set of filtersapplied to the current folder (e.g., the important filter 586 b and theunread filter 586 e). As another example, in FIG. 6D, the filteraffordance 616 b includes an indication of the set of filters applied tothe current folder (e.g., the flagged filter 642 d). As such, accordingto some embodiments, the user is able to keep track of the filter(s)applied to the first grouping and is alerted to the fact that a filterhas been applied to the current view.

In some embodiments, the set of one or more filter criteria includes(912) two or more filter criteria. For example, in FIG. 5L, the filteredinbox folder view 5114 corresponds to the important filter 586 b and theunread filter 586 e being applied to the inbox folder.

In some embodiments, the second set of representations of electroniccommunications that match the set of one or more filter criteria areordered (914) based on how many of the two or more filter criteria thecorresponding electronic communications match. According to someembodiments, when the set of filter criteria includes two filters,electronic communications that match two criteria are sorted beforeelectronic communications that match only one of the two filtercriteria. For example, the second set of representations of electroniccommunications includes: a first subset of representations withelectronic communications that match Filter A AND Filter B; a secondsubset of representations with electronic communications that matchFilter A ANDNOT Filter B; and a third subset of representations withelectronic communications that match Filter B ANDNOT Filter A. In thisexample, the second set of representations is sorted such that the firstsubset of representations is displayed before the second subset ofrepresentations, which is displayed before the third subset ofrepresentations.

In some embodiments, the second set of representations of electroniccommunications that match the set of one or more filter criteria aredisplayed in an inbox pane, and the device concurrently displays (916),on the display, a content pane adjacent to the inbox pane, where thecontent pane includes information corresponding to a respectiveelectronic communication that matches the set of one or more filtercriteria. For example, FIG. 6D shows the filtered inbox folder in thefolders pane 610 and the content 652 for the conversation 612 c includedin the filtered inbox folder displayed in the content pane 620 inresponse to the selection input of the filter affordance 616 b in FIG.6B that corresponds to the first input type (e.g., a single click withthe focus selector 603).

In some embodiments, in response to detecting the selection input, andin accordance with a determination that the selection input correspondsto the first input type, the device displays (918), on the display, anindication of a portion of the first set of representations ofelectronic communications that have been elided, where the indication isdisplayed between first and second subsets of the second set ofrepresentations of electronic communications. As one example, FIG. 5Lshows an expansion affordance 5102 a that separates the conversation 504a the conversation 504 f within the filtered inbox view 5114. Forexample, the first set of one or more messages are elided due to notsatisfying the set of filter criteria. As another example, FIG. 6D showsan expansion affordance 654 above the conversation 612 c in the folderspane 610 associated with the filter inbox folder. For example, the setof one or more messages are elided due to not satisfying the set offilter criteria (e.g., the flagged filter 642 d). As such, according tosome embodiments, the expansion affordance provides a visual queue ofelectronic communications that have been elided in a non-obtrusivemanner.

In some embodiments, displaying the second set of representations ofelectronic communications from among the plurality of representations ofelectronic communications associated with the first grouping that matchthe set of one or more filter criteria includes (920): displaying afirst subset of representations of electronic communications that matchthe set of one or more filter criteria and a second subset ofrepresentations of electronic communications that match the set of oneor more filter criteria from among the plurality of representations ofelectronic communications associated with the first grouping; anddisplaying an expansion affordance between and adjacent to the first andsecond subsets of representations of electronic communications, wherethe expansion affordance is provided to display a portion of the firstset of representations of electronic communications that do not matchthe set of one or more filter criteria. As one example, FIG. 5L shows anexpansion affordance 5102 a that separates the conversation 504 a theconversation 504 f within the filtered inbox view 5114. According tosome embodiments, the expansion affordance 5102 a indicates that a firstset of one or more messages with timestamps between the timestampassociated with the conversation 504 a and the timestamp associated withthe conversation 504 f have been elided. For example, the first set ofone or more messages are elided due to not satisfying the set of filtercriteria. When activated (e.g., with a contact), the expansionaffordance 5102 a causes the first set of one or more elided messages tobe displayed between the conversation 504 a and the conversation 504 f.As such, according to some embodiments, the user is able to quickly viewrepresentations of electronic communications that have been elided in anon-obtrusive manner.

As another example, FIG. 6D shows an expansion affordance 654 above theconversation 612 c in the folders pane 610 associated with the filterinbox folder. According to some embodiments, the expansion affordance654 indicates that a set of one or more messages with timestamps beforethe timestamp associated with the conversation 612 c have been elided.For example, the set of one or more messages are elided due to notsatisfying the set of filter criteria (e.g., the flagged filter 642 d).When activated (e.g., with the focus selector 603), the expansionaffordance 654 causes the set of one or more elided messages to bedisplayed above the conversation 612 c.

In some embodiments, electronic communications in the portion of thefirst set of representations of electronic communications that do notmatch the set of one or more filter criteria are associated (922) withtimestamps between timestamps associated with electronic communicationsin the first and second subsets of representations of electroniccommunications that match the one or more filter criteria. As oneexample, FIG. 5L shows an expansion affordance 5102 a that separates theconversation 504 a the conversation 504 f within the filtered inbox view5114. According to some embodiments, the expansion affordance 5102 aindicates that a first set of one or more messages with timestampsbetween the timestamp associated with the conversation 504 a and thetimestamp associated with the conversation 504 f have been elided.

In some embodiments, the device (924): detects a second selection inputthat corresponds to selection of the expansion affordance; and, inresponse to detecting the second selection input, replaces display ofthe expansion affordance, on the display, with the portion of the firstset of representations of electronic communications that do not matchthe set of one or more filter criteria, where the portion of the firstset of representations of electronic communications that do not matchthe set of one or more filter criteria are displayed between andadjacent to the first and second subsets of representations ofelectronic communications that match the one or more filter criteria.According to some embodiments, selection of the expansion affordancecauses a group of elided messages with timestamps between the first andsecond subsets of representations that match the filter criteria to bedisplayed. As such, according to some embodiments, the user is able toquickly view representations of electronic communications that have beenelided in a non-obtrusive manner. For example, FIG. 5M shows a first setof elided messages displayed in the filtered inbox view 5114 in responseto selection of the expansion affordance 5102 a in FIG. 5L. As shown inFIG. 5M, the first set of elided messages corresponding to theconversations 504 e, 504 c, and 504 d that do not match the filtercriteria is displayed between the conversations 504 a and 504 f thatmatch the filter criteria.

In some embodiments, selection of the expansion affordance causes agroup of elided messages with timestamps before the second set ofrepresentations of electronic communications that match the filtercriteria to be displayed. For example, in FIG. 6D, the expansionaffordance 654 is displayed above the conversation 612 c in the folderspane 610 associated with the filtered inbox folder. In this example,selection of the expansion affordance 654 would cause elided messageswith timestamps before the conversation 612 c to be displayed above theconversation 612 c within the folders pane 610. In some embodiments,selection of the expansion affordance causes a group of elided messageswith timestamps after the second set of representations of electroniccommunications that match the filter criteria to be displayed. Forexample, in FIG. 6E, the expansion affordance 666 is displayed above theconversation 662 d in the folders pane 610 associated with the filteredfolder A. In this example, selection of the expansion affordance 666would cause elided messages with timestamps after the conversation 662 dto be displayed below the conversation 662 d within the folders pane610.

In some embodiments, in response to detecting the selection input, andin accordance with a determination that the selection input correspondsto a second input type (e.g., a one finger long press gesture, a onefinger deep press gesture, a double click with a focus selector, or thelike), the device displays (926), on the display, a filter selectionmenu overlaid on the plurality of representations of electroniccommunications associated with the first grouping. As such, according tosome embodiments, the user is able to quickly change the filter criteriafrom within the current inbox view. As one example, FIG. 5I shows thefilters pane 582 replacing display of the inbox folder view 502 inresponse to the selection input of the filter affordance 518 a in FIG.5H that corresponds to the second input type (e.g., a one finger longpress gesture). According to some embodiments, the filters pane 582replaces display of the inbox folder view 502 when a one finger longpress gesture is detected over the filter affordance 518 a while the setof filter criteria are active (e.g., currently applied to the inboxfolder).

As another example, FIG. 6C shows the filters menu 640 overlaid on thewindow 602 in response to selection input of the filter affordance 616 bin FIG. 6B that corresponds to the second input type (e.g., a doubleclick with the focus selector 603). According to some embodiments, thefilters menu 640 is overlaid on the window 602 when a one finger longpress gesture is detected over the filter affordance 616 b while the setof filter criteria are active (e.g., currently applied to the inboxfolder).

In some embodiments, the filter selection menu is provided (928) to atleast one of enable or disable one or more filters among a plurality offilters included in the filter menu. In some embodiments, the filterselection menu enables the user is able to turn enable or disable any ofthe filters in the filter menu. For example, in FIG. 5H, the filterspane 582 includes: an inbox filter 586 a, an important filter 586 b, aVIP filter 586 c, a flagged filter 586 d, an unread filter 586 e, a “Toor CC” filter 586 f, and an attachments filter 586 g. FIGS. 5I-5.1 alsoshow a sequence in which the filter criteria are changed to include theimportant filter 586 b in addition to the unread filter 586 e. As shownin FIG. 5I, the set of filter criteria includes the important filter 586b and the unread filter 586 e as indicated by the icons 588 a and 588 b.

In another example, in FIG. 6C, the filters menu 640 includes: an inboxfilter 642 a, an important filter 642 b, a VIP filter 642 c, a flaggedfilter 642 d, an unread filter 642 e, a “To or CC” filter 642 f, and anattachments filter 642 g. As shown in FIG. 6C, the set of filtercriteria includes the flagged filter 642 d as indicated by the icon 646a associated with the unread filter 642 e.

In some embodiments, the filter selection menu includes (930) anaffordance provided to add a custom filter to the plurality of filtersincluded in the filter menu. As one example, the filters pane 582 inFIGS. 5I-5J includes also includes a create custom filter affordance 590for creating and adding a custom filter to the filter pane 582. Asanother example, the filters menu 640 in FIG. 6C also includes a createcustom filter affordance 644 for creating and adding a custom filter tothe filters menu 640.

In some embodiments, after detecting the selection input, the devicedetects (932) a sequence of one or more user inputs, via the inputdevice, that correspond to displaying a second plurality ofrepresentations of electronic communications associated with a secondgrouping, and, in response to detecting the sequence of one or more userinputs, the device displays, on the display, a third set ofrepresentations of electronic communications from among the secondplurality of representations of electronic communications associatedwith the second grouping that match the set of one or more filtercriteria and the indication of the set of one or more filter criteriathat have been applied to the electronic communications associated withthe second grouping. In FIG. 6D, the set of filter criteria (e.g., theflagged filter 642 d) is applied to the inbox folder (e.g., the filteredinbox folder is displayed in the folders pane 610). For example, a userchanges the grouping (e.g., via the sequence of one or more user inputs)from the inbox folder to the folder A. Continuing with this example,FIG. 6E shows the set of filter criteria (e.g., the flagged filter 642d) applied to the folder A (e.g., the filtered folder A is displayed inthe folders pane 610). As such, when the set of filter criteria areapplied to a first grouping and the grouping changes from the firstgrouping to a second grouping, the set of filter criteria are alsoapplied to the second grouping. This, for example, allows the user tomaintain the filter criteria when switching between groupings.

In some embodiments, while displaying the third set of representationsof electronic communications, the device detects (934) a secondselection input, via the input device, that corresponds to selection ofthe filter affordance, and, in response to detecting the secondselection input, and in accordance with a determination that theselection input corresponds to the first input type, the deviceconcurrently displays, on the display, the third set of representationsof electronic communications from among the second plurality ofrepresentations of electronic communications associated with the secondgrouping that match the set of one or more filter criteria and a fourthset of representations of electronic communications from among thesecond plurality of representations of electronic communicationsassociated with the second grouping that do not match the set of one ormore filter criteria. According to some embodiments, when the set offilter criteria are currently active, the set of filter criteria aredeactivated by a selection input of the filter affordance thatcorresponds to the first input type (e.g., a one finger tap gesture, aone finger light press gesture, a single click with a focus selector, orthe like). As such, according to some embodiments, the user is able toquickly toggle on/off the application of the filter criteria to thecurrent grouping.

For example, the set of filter criteria are no longer applied to thefolder A and FIG. 6F shows the (unfiltered) folder A in the folders pane610 in response to selection input of the filter affordance 616 b inFIG. 6E that corresponds to the first input type (e.g., a single clickwith the focus selector 603). As shown in FIG. 6F, the filter affordance616 b indicates that no filters are currently applied to folder A, ascompared to FIG. 6E where the flagged filter 642 d is applied to folderA.

It should be understood that the particular order in which theoperations in FIGS. 9A-9C have been described is merely example and isnot intended to indicate that the described order is the only order inwhich the operations could be performed. One of ordinary skill in theart would recognize various ways to reorder the operations describedherein. Additionally, it should be noted that details of other processesdescribed herein with respect to other methods described herein (e.g.,methods 800 and 1000) are also applicable in an analogous manner tomethod 900 described above with respect to FIGS. 9A-9C. For example, thecontacts, gestures, user interface objects, and focus selectorsdescribed above with reference to method 900 optionally have one or moreof the characteristics of the contacts, gestures, user interfaceobjects, and focus selectors described herein with reference to othermethods described herein (e.g., methods 800 and 1000). For brevity,these details are not repeated here.

FIGS. 10A-10C illustrate a flow diagram of a method 1000 of displayingaffordances for performing corresponding actions within a conversationview in accordance with some embodiments. The method 1000 is performedat an electronic device (e.g., the portable multifunction device 100 inFIG. 1A, or the device 300 in FIG. 3) with a one or more processors,non-transitory memory, a display, and an input device. In someembodiments, the display is a touch-screen display and the input deviceis on or integrated with the display. In some embodiments, the displayis separate from the input device. Some operations in method 1000 are,optionally, combined and/or the order of some operations is, optionally,changed.

As described below, the method 1000 provides an intuitive way to displayaffordances for performing corresponding actions within a conversationview. The method reduces the cognitive burden on a user when displayingaffordances for performing corresponding actions within a conversationview, thereby creating a more efficient human-machine interface. Forbattery-operated electronic devices, enabling a user to displayaffordances for performing corresponding actions within a conversationview faster and more efficiently conserves power and increases the timebetween battery charges.

The device displays (1002), on the display, a conversation view of aplurality of messages within a first pane of a messaging application,where the conversation view includes a first message region of a portionof a first message of the plurality of messages and a second messageregion of a portion of a second message of the plurality of messages. Insome embodiments, the plurality of messages in the conversation satisfyone or more conversation criteria (e.g., similar participants, subject,content, etc.). In some embodiments, the user is able to scroll withinthe conversation view to view, for example, a third message regionassociated with a third message included in the conversation. In someembodiments, when the second message region is partially occluded, theuser is able to scroll within the conversation view to view the balanceof the second message region. As such, in this example, the entirety ofthe first message region is displayed within the conversation view, anda portion of the second message is displayed in the conversation viewwith the remainder occluded. For example, the first and second messageregions include a preview or snippet of the associated messages.

FIG. 7B, for example, shows a conversation view 730 (e.g., associatedwith the conversation 704 a in FIG. 7A) displayed within the displayarea of the device 100. As shown in FIG. 7B, the conversation view 730includes: a header region 731 a, a content region 731 b, a toolbarregion 731 c, and a subject bar 734. In FIG. 7B, the content region 731b includes: a first message region 732 a associated with a first messagein the conversation 704 a; a second message region 732 b associated witha second message in the conversation 704 a; and a portion of a thirdmessage region 732 c associated with a third message in the conversation704 a (sometimes collectively referred to as the “message regions 732”).For example, if a user scrolls the conversation view 730, the balance ofthe third message region 732 c is displayed within the content region731 b. For example, FIGS. 7B-7C show a sequence in which the userscrolls within the conversation view 730 in response to detecting anupward swipe gesture in FIG. 7B.

In some embodiments, the conversation view includes (1004) a toolbarregion including a plurality of affordances provided to performcorresponding actions on a most recent message among the plurality ofmessages. In some embodiments, the messages within the conversation vieware sorted in reverse chronological order. As such, in FIG. 7B, forexample, the first message associated with the message region 732 a isthe most recent message in the conversation 704 a. In some embodiments,the messages within the conversation view are sorted in chronologicalorder. As such, in FIG. 7B, for example, the first message associatedwith the message region 732 a is the oldest message in the conversation704 a. According to some embodiments, with reference to FIGS. 7A-7K, thetoolbar region 731 c includes: a flag affordance 728 a for flagging arespective message in the conversation 704 a; a move folder affordance728 b for moving the respective message in the conversation 704 a fromthe inbox folder to another folder; an archive affordance 728 c forarchiving the respective message in the conversation 704 a; a replyaffordance 728 d for replying to or forwarding the respective message inthe conversation 704 a; and a draft affordance 728 e for drafting a newmessage. In some embodiments, the respective message is the most recentmessage within the conversation 704 a. In some embodiments, therespective message is the top-most message that is fully displayedwithin the conversation view 730.

In some embodiments, a respective dimension (e.g., the height) of thefirst message region is (1006) based at least in part on an amount ofcontent associated with the first message, and a respective dimension(e.g., the height) of the second message region is based at least inpart on an amount of content associated with the second message. Asshown in FIG. 7B, according to some embodiments, a respective dimension(e.g., the height) of each of the message regions 732 is based on theamount of content for the corresponding message. For example, in FIG.7B, a respective dimension (e.g., the height) of the first messageregion 732 a has a value 733 a, and the respective dimension (e.g., theheight) of the second message region 732 b has a value 733 b. In thisexample, the value 733 b is greater than the value 733 a because thefirst message associated with the first message region 732 a has lesscontent (e.g., lines of text) than the second message associated withthe second message region 732 b.

In some embodiments, the device displays (1008), on the display, a listview including a plurality of rows representing a plurality ofconversations in a second pane adjacent to the first pane that includesthe conversation view. For example, the plurality of conversationscorresponds to a particular grouping such as a specified mailbox,folder, or tag. In some embodiments, the list view and the conversationview are concurrently displayed side-by-side to enable the user toselect between different conversations to be shown in the conversationview. As such, for example, the device 100 displays a second pane with alist of conversations adjacent to a first pane including a conversationview corresponding to a conversation selected within the list ofconversations.

FIGS. 7L-7P, for example show a dual-pane user interface associated withan electronic mail (email) and/or messaging application that includes afirst pane 7120 and a second pane 7110 displayed within the display areaof the device 100. In FIG. 7L, for example, the second pane 7110includes a folder view 7140 for an inbox folder. As shown in FIG. 7L,the inbox folder view 7140 includes a plurality of rows representingconversation 704 a, message 704 b, message 704 c, and conversation 704 dwithin the inbox folder. In FIG. 7L, the conversation 704 a is displayedin the foreground or “in focus” as indicated by the vertical orientationof the view mode affordance 7111 a and the shading of the first rowwithin the second pane 7110. In FIG. 7L, for example, the first pane7120 includes a conversation view 7150 of the conversation 704 a, whichis displayed in the foreground in the second pane 7110.

The device detects (1010) a user input, via the input device, thatcorresponds to selecting the first message region within theconversation view. As one example, FIG. 7E shows a right-to-left swipegesture within the second message region 732 b. As another example, FIG.7H shows a left-to-right swipe gesture within the second message region732 b. As yet another example, FIG. 7J shows a contact 764 selecting the“see more” affordance 738 b within the second message region 732 b.

In response to detecting the user input selecting the first messageregion, and in accordance with a determination that the user inputsatisfies a first set of input criteria (e.g., a horizontal swipe withinthe message, selection of an actions affordance within the messageregion, or the like), the device displays (1012), on the display, one ormore affordances provided to perform corresponding actions on the firstmessage. In some embodiments, the first set of input criteria issatisfied when an actions affordance is selected within the firstmessage region. In some embodiments, the first set of input criteria issatisfied when a horizontal swipe is detected within the first messageregion. As such, according to some embodiments, the user is able toquickly access options for performing actions on a message from withinthe conversation view, which saves the user time and effort and alsoconserves power.

As one example, FIGS. 7C-7D shows a sequence in which a first set ofaffordances 746 a, 746 b, and 746 c is displayed within a first actionregion 744 in response to selection of the actions affordance 738 cwithin the second message region 732 b in FIG. 7C. As another example,FIGS. 7E-7F show sequence in which the first set of affordances 746 a,746 b, and 746 c is displayed within a first action region 744 inresponse to detecting the right-to-left swipe gesture within the secondmessage region 732 b in FIG. 7E. As yet another example, FIGS. 7H-7Ishow a sequence in which in which a second set of one or moreaffordances including the affordance 762 is displayed within the secondaction region 760 in response to detecting the left-to-right swipegesture within the second message region 732 b in FIG. 7H.

In some embodiments, satisfying the first input criteria includes (1014)detecting a horizontal swipe gesture within the first message regionassociated with a magnitude that is less than a threshold distance. Insome embodiments, the first set of input criteria is satisfied when ahorizontal swipe that is less than a threshold distance is detectedwithin the first message region. For example, a left-to-right or aright-to-left swipe gesture with a magnitude less than 33%, 50%, 100%,etc. of the width of the message region. As one example, FIGS. 7E-7Fshow a sequence in which the first set of affordances 746 a, 746 b, and746 c is displayed within the conversation view 730 in response todetecting the right-to-left swipe gesture with a magnitude that is lessthan the threshold distance within the second message region 732 b inFIG. 7E. As another example, FIGS. 7H-7I show a sequence in which inwhich the second set of one or more affordances including the affordance762 is displayed within the conversation view 730 in response todetecting the left-to-right swipe gesture with a magnitude that is lessthan the threshold distance within the second message region 732 b inFIG. 7H.

In some embodiments, satisfying the first input criteria includes (1016)detecting a user input that corresponds to selecting an actionsaffordance within the first message region. For example, FIGS. 7C-7Dshows a sequence in which the first set of affordances 746 a, 746 b, and746 c is displayed within the conversation view 730 in response toselection of the actions affordance 738 c within the second messageregion 732 b in FIG. 7C.

In some embodiments, displaying the one or more affordances includes(1018): in accordance with a determination that the user input isassociated with a first direction (e.g., right-to-left): displaying, onthe display, a first set of one or more affordances adjacent to a firstside of the message region, where the first set of one or moreaffordances is provided to perform corresponding actions on the firstmessage; and sliding the first message region in the first direction,where at least a portion of first message region associated with asecond side of the first message region opposite the first side isoccluded. As one example, if an actions affordance is selected withinthe first message region, a first set of one or more affordancesincluding reply, move, and trash is slid in from the right edge of theconversation view and the first message region is proportionately slidleft with a portion being occluded (e.g., as shown in FIGS. 7C-7D). Asanother example, if a right-to-left swipe gesture is detected within thefirst message region, a first set of one or more affordances includingreply, move, and trash is slid in from the right edge of theconversation view and the first message region is proportionately slidleft with a portion being occluded (e.g., as shown in FIGS. 7E-7F andFIG. 7L-7M). In some embodiments, one or more of the first set of one ormore affordances is customizable. In one example, the rightmost ormiddle affordance is customizable. As such, according to someembodiments, the user is able to quickly access a first set of one ormore options from within the conversation view, which saves the usertime and effort and also conserves power.

In some embodiments, the device (1020): detects a subsequent user input,via the input device, that corresponds to selecting a respectiveaffordance from among the first set of one or more affordances; and, inresponse to detecting the subsequent user input selecting the respectiveaffordance, displays, on the display, one or more options associatedwith the action that corresponds to the respective affordance. Forexample, the subsequent user input corresponds to a one finger tapgesture, a two finger tap gesture, a vertical swipe gesture, or the likeover the respective affordance. As one example, if the user selects areply affordance, a menu of reply options (e.g., reply, reply all,forward, and/or the like) slides up from the bottom edge of the displayarea (e.g., as shown in FIGS. 7F-7G).

In some embodiments, displaying the one or more affordances includes(1022): in accordance with a determination that the user input isassociated with a second direction (e.g., left-to-right): displaying, onthe display, a second set of one or more affordances adjacent to asecond side of the message region, where the second set of one or moreaffordances is provided to perform corresponding actions on the firstmessage; and sliding the first message region in the second direction,where at least a portion of first message region associated with a firstside of the first message region opposite the second side is occluded.As one example, if a left-to-right swipe gesture is detected within thefirst message region, a second set of one or more affordances includingmark as read or mark as unread is slid in from the left edge of theconversation view and the first message region is proportionately slidright with a portion being occluded (e.g., as shown in FIGS. 7H-7I andFIG. 7N-7O). In some embodiments, the second set of one or moreaffordances is customizable. As such, according to some embodiments, theuser is able to quickly access a second set of one or more options fromwithin the conversation view, which saves the user time and effort andalso conserves power.

In some embodiments, displaying the one or more affordances includes(1024) maintaining display of the second message region within theconversation view. In some embodiments, continue to display at least aportion of the second message region as displayed prior to detecting theuser input. As one example, with reference to FIGS. 7E-7F, the firstmessage region 732 a and the third message region 732 c maintain theirrespective positions after the right-to-left swipe gesture in FIG. 7E.As another example, with reference to FIGS. 7H-7I, the first messageregion 732 a and the third message region 732 c maintain theirrespective positions after the left-to-right swipe gesture in FIG. 7H.As yet another example, with reference to FIGS. 7L-7M, the secondmessage region 732 b and the third message region 732 c maintain theirrespective positions after the right-to-left swipe gesture in FIG. 7L.As yet another example, with reference to FIGS. 7N-7O, the secondmessage region 732 b and the third message region 732 c maintain theirrespective positions after the left-to-right swipe gesture in FIG. 7N.

In response to detecting the user input selecting the first messageregion, and in accordance with a determination that the user inputsatisfies a second set of input criteria (e.g., a finger tap gesturewithin a header of the message region, selection of a “see more”affordance, or the like), the device replaces display of (1026) theconversation view with a message view that corresponds to the firstmessage. As such, for example, show the selected message in a messageview that replaces the conversation view. FIGS. 7J-7K, for example, showa sequence in which a message view 770 of the second message within theconversation 704 a that corresponds to the second message region 732 breplaces display of the conversation view 730 in response to selectionof the “see more” affordance 738 b within the second message region 732b in FIG. 7J.

In some embodiments, satisfying the second input criteria includes(1028) detecting a user input that corresponds to selecting a headersub-region of the first message region. In some embodiments, the secondset of criteria are satisfied when a header of the first message regionis selected. For example, with reference to FIG. 7B, if a contact isdetected over the header sub-region 731 b of the first message region732 a (not shown), a message view with the contents of the first messagecorresponding to the first message region 732 a replaces display of theconversation view 730.

In some embodiments, satisfying the second input criteria includes(1030) detecting a user input that corresponds to selecting a “see more”affordance within the first message region. In some embodiments, thesecond set of criteria are satisfied when a “see more” affordance withinthe first message region is selected (e.g., as shown in FIGS. 7J-7K).

In some embodiments, in response to detecting the user input, and inaccordance with a determination that the user input satisfies a thirdset of input criteria, the device performs (1032) a predefined action onthe first message. As one example, if a left-to-right swipe gesture isdetected within the first message region that is greater than athreshold distance (e.g., 33%, 50%, 100%, etc. of the width of themessage region), a predefined action associated with one of the firstset of one or more affordances is performed on the first message thatcorresponds to the first message region (e.g., the first message ismoved to the trash). As another example, if a right-to-left swipegesture is detected within the first message region that is greater thana threshold distance (e.g., 33%, 50%, 100%, etc. of the width of themessage region), a predefined action associated with one of the secondset of one or more affordances is performed on the first message thatcorresponds to the first message region (e.g., the first message ismarked as read or marked as unread).

In some embodiments, satisfying the third input criteria includes (1034)detecting a horizontal swipe gesture within the first message regionassociated with a magnitude that is greater than a threshold distance.According to some embodiments, the third set of criteria are satisfiedwhen a magnitude of a horizontal swipe gesture within the first messageregion is greater than the threshold distance (e.g., 33%, 50%, 100%,etc. of the width of the message region).

In some embodiments, the device detects (1036) a second user input, viathe input device, corresponding to the second message region within theconversation view. In response to detecting the second user input, andin accordance with a determination that the second user input satisfiesthe first set of input criteria (e.g., a lateral swipe within themessage, selection of an actions affordance within the message region,or the like), the device displays one or more affordances provided toperform corresponding actions to the second message. In response todetecting the second user input, and in accordance with a determinationthat the second user input satisfies the second set of input criteria(e.g., a finger tap gesture within a header of the message region,selection of a “see more” affordance, or the like), the device replacesdisplay of the conversation view with a message view that corresponds onthe second message. As such, for example, the user is able to similarlyinteract with any message within the conversation view. In FIGS. 7B-7K,for example, the user interacts with the second message region 732 bthat corresponds to a second message within the conversation 704 a. InFIGS. 7L-7O, for example, the user interacts with the first messageregion 732 a that corresponds to a first message within the conversation704 a. As such, according to some embodiments, the user is able toquickly access options for performing actions on a message byinteracting with any of the message regions in the conversation view,which saves the user time and effort and also conserves power.

In some embodiments, prior to displaying the conversation view withinthe first pane of the messaging application, the device (1038):displays, on the display, a mailbox view that includes a plurality ofrepresentations of corresponding to one or more messages and one or moreconversations, where the plurality of representations have a same size(e.g., rows for messages and/or conversations with a same height in alist view); and detects a second user input, via the input device, thatcorresponds to selecting a respective representation from among theplurality of representations. In response to detecting the second userinput selecting the respective representation, and in accordance with adetermination that respective representation corresponds to a message,the device replaces display of the mailbox view with a message view thatcorresponds to the message associated with the respectiverepresentation. In response to detecting the second user input selectingthe respective representation, and in accordance with a determinationthat respective representation corresponds to a conversation, the devicereplaces display of the mailbox view with the conversation view thatcorresponds to the conversation associated with the respectiverepresentation, where the conversation includes the plurality ofmessages.

FIGS. 7A-7B, for example, show a sequence in which a conversation view730 for a conversation 704 a replaces display of the inbox folder view702 in response to selection of the first row corresponding to theconversation 704 a in FIG. 7A. As shown in FIG. 7A, a respectivedimension (e.g., the height) of each of the rows in the inbox folderview 702 has the same value 703. In contrast, as shown in FIG. 7B, therespective dimension (e.g., the height) of each of the message regions732 is based on the amount of content for the corresponding message. InFIG. 7B, the respective dimension (e.g., the height) of the firstmessage region 732 a has a value 733 a, and the respective dimension(e.g., the height) of the second message region 732 b has a value 733 b.In this example, the value 733 b is greater than the value 733 a becausethe first message associated with the first message region 732 a hasless content (e.g., lines of text) than the second message associatedwith the second message region 732 b.

It should be understood that the particular order in which theoperations in FIGS. 10A-10C have been described is merely example and isnot intended to indicate that the described order is the only order inwhich the operations could be performed. One of ordinary skill in theart would recognize various ways to reorder the operations describedherein. Additionally, it should be noted that details of other processesdescribed herein with respect to other methods described herein (e.g.,methods 800 and 900) are also applicable in an analogous manner tomethod 1000 described above with respect to FIGS. 10A-10C. For example,the contacts, gestures, user interface objects, and focus selectorsdescribed above with reference to method 1000 optionally have one ormore of the characteristics of the contacts, gestures, user interfaceobjects, and focus selectors described herein with reference to othermethods described herein (e.g., methods 800 and 900). For brevity, thesedetails are not repeated here.

In accordance with some embodiments, FIG. 11 shows a functional blockdiagram of an electronic device 1100 configured in accordance with theprinciples of the various described embodiments. The functional blocksof the device are, optionally, implemented by hardware, software,firmware, or a combination thereof to carry out the principles of thevarious described embodiments. It is understood by persons of skill inthe art that the functional blocks described in FIG. 11 are, optionally,combined or separated into sub-blocks to implement the principles of thevarious described embodiments. Therefore, the description hereinoptionally supports any possible combination or separation or furtherdefinition of the functional blocks described herein.

As shown in FIG. 11, an electronic device 1100 includes a display unit1102 configured to display a user interface, one or more input units1104 configured to receive user inputs, and a processing unit 1108coupled to the display unit 1102 and the one or more input units 1104.In some embodiments, the processing unit 1108 includes: a displaycontrol unit 1110, and an input detecting unit 1112.

The processing unit 1108 is configured to enable display of (e.g., withthe display control unit 1110), on the display unit 1102, an inbox viewof a messaging application that includes a plurality of rowsrepresenting electronic communications, the plurality of rows includinga first row representing a first plurality of messages that satisfy oneor more conversation criteria that indicate that each of the firstplurality of messages are a part of a same respective conversation, anda second row representing a second plurality of messages that satisfy afirst category criterion but are not part of a same conversation. Theprocessing unit 1108 is also configured to detect (e.g., with the inputdetecting unit 1112) an input, via the one or more input units 1104,corresponding to selection of a respective row from among the pluralityof rows in the inbox view. In response to detecting the input, theprocessing unit 1108 is further configured to enable display of (e.g.,with the display control unit 1110), on the display unit 1102,additional information corresponding to two or more messages from theconversation of related messages that are represented by the first rowin accordance with a determination that the respective row correspondsto the first row. In response to detecting the input, the processingunit 1108 is further configured to enable display of (e.g., with thedisplay control unit 1110), on the display unit 1102, additionalinformation corresponding to two or more messages from among theplurality of messages that are represented by the second row, includinga first message and a second message that both satisfy the firstcategory criterion but not part of a same conversation in accordancewith a determination that the respective row corresponds to the secondrow.

In some embodiments, the additional information corresponding to the twoor more messages from the conversation of related messages that arerepresented by the first row is displayed inline in the inbox view, andthe additional information corresponding to the two or more messagesfrom among the plurality of messages that are represented by the secondrow is displayed inline in the inbox view

In some embodiments, the additional information corresponding to the twoor more messages from the conversation of related messages that arerepresented by the first row replaces display of the inbox view, and theadditional information corresponding to the two or more messages fromamong the plurality of messages that are represented by the second rowreplaces display of the inbox view.

In some embodiments, the additional information corresponding to the twoor more messages from the conversation of related messages that arerepresented by the first row is displayed in a content pane separatefrom the inbox view displayed in an inbox pane, and the additionalinformation corresponding to the two or more messages from among theplurality of messages that are represented by the second row isdisplayed in the content pane separate from the inbox view displayed inthe inbox pane.

In some embodiments, the plurality of rows in the inbox view is sortedby date, and the second row representing the plurality of messages isincluded in the inbox view based on a date of a most recently receivedmessage among the plurality of messages.

In some embodiments, the first category criterion corresponds to one ofa sender type of the second plurality of messages or a content type ofthe second plurality of messages.

In some embodiments, the second row is displayed in a condensed viewmode prior to detecting the user input.

In some embodiments, the condensed view mode includes one or more of anindication of the first category, one or more senders of the pluralityof messages represented by the second row, an indication of a mostrecently received message among the plurality of messages represented bythe second row, an indication of a count of the plurality of messagesrepresented by the second row, or an indication of a count of the unreadmessages among the plurality of messages represented by the second row.

In some embodiments, the second plurality of messages represented by thesecond row are not displayed in the inbox view while the second row isdisplayed in the condensed view mode.

In some embodiments, the second row includes a view mode affordanceprovided to toggle between the condensed view mode and an expanded viewmode of the second row.

In some embodiments, the user input corresponds to selection of the viewmode affordance, and the second row is displayed in the expanded viewmode after detecting the user input.

In some embodiments, the expanded view mode includes an affordanceprovided to display the plurality of messages different from the two ormore messages.

In some embodiments, the two or more messages from among the pluralityof messages that are represented by the second row include a subset ofthe plurality of messages selected based on a predetermined criterion.

In some embodiments, the inbox view of the messaging applicationincludes a third row representing a third plurality of messages thatsatisfy a second category criterion different from the first categorycriterion.

In some embodiments, the inbox view is included in an inbox pane, andthe processing unit 1108 is further configured to enable display of(e.g., with the display control unit 1110), on the display unit 1102, acontent pane adjacent to the inbox pane, where the content pane includesinformation associated with the conversation of related messagesrepresented by the first row or the plurality of messages represented bythe second row.

In some embodiments, the content pane includes an indication that theinformation included in the content pane corresponds to the plurality ofmessages that do not meet the one or more conversation criteriarepresented by the second row.

In some embodiments, the information included in the content pane has adifferent appearance for the plurality of messages that do not meet theone or more conversation criteria, the conversation of related messages,and a message.

In accordance with some embodiments, FIG. 12 shows a functional blockdiagram of an electronic device 1200 configured in accordance with theprinciples of the various described embodiments. The functional blocksof the device are, optionally, implemented by hardware, software,firmware, or a combination thereof to carry out the principles of thevarious described embodiments. It is understood by persons of skill inthe art that the functional blocks described in FIG. 12 are, optionally,combined or separated into sub-blocks to implement the principles of thevarious described embodiments. Therefore, the description hereinoptionally supports any possible combination or separation or furtherdefinition of the functional blocks described herein.

As shown in FIG. 12, an electronic device 1200 includes a display unit1202 configured to display a user interface, one or more input units1204 configured to receive user inputs, and a processing unit 1208coupled to the display unit 1202 and the one or more input units 1204.In some embodiments, the processing unit 1208 includes: a displaycontrol unit 1210, an input detecting unit 1212, and a determining unit1214.

The processing unit 1208 is configured to enable concurrent display of(e.g., with the display control unit 1210), on the display unit 1202, aplurality of representations of electronic communications, and a filteraffordance, where the filter affordance corresponds to a set of one ormore filter criteria. The processing unit 1208 is also configured todetect (e.g., with the input detecting unit 1212) a selection input, viathe one or more input units 1204, that corresponds to selection of thefilter affordance while concurrently displaying the plurality ofrepresentations of electronic communications and the filter affordance.In response to detecting the selection input, and in accordance with adetermination (e.g., with the determining unit 1214) that the selectioninput corresponds to a first input type, the processing unit 1208 isfurther configured to: cease display of (e.g., with the display controlunit 1210), on the display unit 1202, a first set of representations ofelectronic communications from among the plurality of representations ofelectronic communications associated with the first grouping that do notmatch the set of one or more filter criteria; enable display of (e.g.,with the display control unit 1210), on the display unit 1202, a secondset of representations of electronic communications from among theplurality of representations of electronic communications associatedwith the first grouping that match the set of one or more filtercriteria; and display of (e.g., with the display control unit 1210), onthe display unit 1202, an indication of the set of one or more filtercriteria that have been applied to the electronic communicationsassociated with the first grouping.

In some embodiments, satisfying a respective criterion from among theset of one or more filter criteria includes determining that electroniccommunications associated with the second set of representations ofelectronic communications are categorized as important based on pastuser actions with electronic communications.

In some embodiments, the indication of the set of one or more filtercriteria includes a description of the set of one or more filtercriteria adjacent to the filter affordance.

In some embodiments, the set of one or more filter criteria includes twoor more filter criteria.

In some embodiments, the second set of representations of electroniccommunications that match the set of one or more filter criteria areordered based on how many of the two or more filter criteria thecorresponding electronic communications match.

In some embodiments, the second set of representations of electroniccommunications that match the set of one or more filter criteria aredisplayed in an inbox pane, and the processing unit 1208 is furtherconfigured to enable concurrent display of (e.g., with the displaycontrol unit 1210), on the display unit 1202, a content pane adjacent tothe inbox pane, where the content pane includes informationcorresponding to a respective electronic communication that matches theset of one or more filter criteria.

In some embodiments, in response to detecting the selection input, andin accordance with a determination (e.g., with the determining unit1214) that the selection input corresponds to a first input type, theprocessing unit 1208 is further configured to enable display of (e.g.,with the display control unit 1210), on the display unit 1202, anindication of a portion of the first set of representations ofelectronic communications that have been elided, where the indication isdisplayed between first and second subsets of the second set ofrepresentations of electronic communications.

In some embodiments, displaying the second set of representations ofelectronic communications from among the plurality of representations ofelectronic communications associated with the first grouping that matchthe set of one or more filter criteria includes: displaying a firstsubset of representations of electronic communications that match theset of one or more filter criteria and a second subset ofrepresentations of electronic communications that match the set of oneor more filter criteria from among the plurality of representations ofelectronic communications associated with the first grouping; anddisplaying an expansion affordance between and adjacent to the first andsecond subsets of representations of electronic communications, wherethe expansion affordance is provided to display a portion of the firstset of representations of electronic communications that do not matchthe set of one or more filter criteria.

In some embodiments, electronic communications in the portion of thefirst set of representations of electronic communications that do notmatch the set of one or more filter criteria are associated withtimestamps between timestamps associated with electronic communicationsin the first and second subsets of representations of electroniccommunications that match the one or more filter criteria.

In some embodiments, the processing unit 1208 is further configured to:detect (e.g., with the input detecting unit 1212) a second selectioninput, via the one or more input units 1204, that corresponds toselection of the expansion affordance; and, in response to detecting thesecond selection input, replace display of (e.g., with the displaycontrol unit 1210) the expansion affordance, on the display unit 1202,with the portion of the first set of representations of electroniccommunications that do not match the set of one or more filter criteria,where the portion of the first set of representations of electroniccommunications that do not match the set of one or more filter criteriaare displayed between and adjacent to the first and second subsets ofrepresentations of electronic communications that match the one or morefilter criteria.

In some embodiments, in response to detecting the selection input, andin accordance with a determination (e.g., with the determining unit1214) that the selection input corresponds to a second input type, theprocessing unit 1208 is further configured to enable display of (e.g.,with the display control unit 1210), on the display unit 1202, a filterselection menu overlaid on the plurality of representations ofelectronic communications associated with the first grouping.

In some embodiments, the filter selection menu is provided to at leastone of enable or disable one or more filters among a plurality offilters included in the filter menu.

In some embodiments, the filter selection menu includes an affordanceprovided to add a custom filter to the plurality of filters included inthe filter menu.

In some embodiments, after detecting the selection input, the processingunit 1208 is further configured to detect (e.g., with the inputdetecting unit 1212) a sequence of one or more user inputs, via the oneor more input units 1204, that correspond to displaying a secondplurality of representations of electronic communications associatedwith a second grouping, and, in response to detecting the sequence ofone or more user inputs, enable display of (e.g., with the displaycontrol unit 1210), on the display unit 1202, a third set ofrepresentations of electronic communications from among the secondplurality of representations of electronic communications associatedwith the second grouping that match the set of one or more filtercriteria and the indication of the set of one or more filter criteriathat have been applied to the electronic communications associated withthe second grouping.

In some embodiments, while displaying the third set of representationsof electronic communications, the processing unit 1208 is furtherconfigured to detect (e.g., with the input detecting unit 1212) a secondselection input, via the one or more input units 1204, that correspondsto selection of the filter affordance, and, in response to detecting thesecond selection input, and in accordance with a determination (e.g.,with the determining unit 1214) that the selection input corresponds tothe first input type, enable concurrent display of (e.g., with thedisplay control unit 1210), on the display unit 1202, the third set ofrepresentations of electronic communications from among the secondplurality of representations of electronic communications associatedwith the second grouping that match the set of one or more filtercriteria and a fourth set of representations of electroniccommunications from among the second plurality of representations ofelectronic communications associated with the second grouping that donot match the set of one or more filter criteria.

In accordance with some embodiments, FIG. 13 shows a functional blockdiagram of an electronic device 1300 configured in accordance with theprinciples of the various described embodiments. The functional blocksof the device are, optionally, implemented by hardware, software,firmware, or a combination thereof to carry out the principles of thevarious described embodiments. It is understood by persons of skill inthe art that the functional blocks described in FIG. 13 are, optionally,combined or separated into sub-blocks to implement the principles of thevarious described embodiments. Therefore, the description hereinoptionally supports any possible combination or separation or furtherdefinition of the functional blocks described herein.

As shown in FIG. 13, an electronic device 1300 includes a display unit1302 configured to display a user interface, one or more input units1304 configured to receive user inputs, and a processing unit 1308coupled to the display unit 1302 and the one or more input units 1304.In some embodiments, the processing unit 1308 includes: a displaycontrol unit 1310, an input detecting unit 1312, a determining unit1314, and a performing unit 1316.

The processing unit 1308 is configured to: enable display of (e.g., withthe display control unit 1310), on the display unit 1302, a conversationview of a plurality of messages within a first pane of a messagingapplication, where the conversation view includes a first message regionof a portion of a first message of the plurality of messages and asecond message region of a portion of a second message of the pluralityof messages; and detect (e.g., with the input detecting unit 1312) auser input, via the one or more input units 1304, that corresponds toselecting the first message region within the conversation view. Inresponse to detecting the user input selecting the first message region,and in accordance with a determination (e.g., with the determining unit1314) that the user input satisfies a first set of input criteria, theprocessing unit 1308 is further configured to enable display of (e.g.,with the display control unit 1310), on the display unit 1302, one ormore affordances provided to perform corresponding actions on the firstmessage. In response to detecting the user input selecting the firstmessage region, and in accordance with a determination (e.g., with thedetermining unit 1314) that the user input satisfies a second set ofinput criteria, the processing unit 1308 is further configured toreplace display of (e.g., with the display control unit 1310) of theconversation view with a message view that corresponds to the firstmessage.

In some embodiments, displaying the one or more affordances includes: inaccordance with a determination that the user input is associated with afirst direction: displaying, on the display, a first set of one or moreaffordances adjacent to a first side of the message region, where thefirst set of one or more affordances is provided to performcorresponding actions on the first message; and sliding the firstmessage region in the first direction, where at least a portion of firstmessage region associated with a second side of the first message regionopposite the first side is occluded.

In some embodiments, the processing unit 1308 is further configured to:detect (e.g., with the input detecting unit 1312) a subsequent userinput, via the one or more input units 1304, that corresponds toselecting a respective affordance from among the first set of one ormore affordances; and in response to detecting the subsequent user inputselecting the respective affordance, enable display of (e.g., with thedisplay control unit 1310), on the display unit 1302, one or moreoptions associated with the action that corresponds to the respectiveaffordance.

In some embodiments, displaying the one or more affordances includes: inaccordance with a determination that the user input is associated with asecond direction: displaying, on the display, a second set of one ormore affordances adjacent to a second side of the message region, wherethe second set of one or more affordances is provided to performcorresponding actions on the first message; and sliding the firstmessage region in the second direction, where at least a portion offirst message region associated with a first side of the first messageregion opposite the second side is occluded.

In some embodiments, displaying the one or more affordances includesmaintaining display of the second message region within the conversationview.

In some embodiments, satisfying the first input criteria includesdetecting a horizontal swipe gesture within the first message regionassociated with a magnitude that is less than a threshold distance.

In some embodiments, satisfying the first input criteria includesdetecting a user input that corresponds to selecting an actionsaffordance within the first message region.

In some embodiments, satisfying the second input criteria includesdetecting a user input that corresponds to selecting a header sub-regionof the first message region.

In some embodiments, satisfying the second input criteria includesdetecting a user input that corresponds to selecting a “see more”affordance within the first message region.

In some embodiments, in response to detecting the user input, and inaccordance with a determination (e.g., with the determining unit 1314)that the user input satisfies a third set of input criteria, theprocessing unit 1308 is further configured to perform (e.g., with theperforming unit 1316) a predefined action on the first message.

In some embodiments, satisfying the third input criteria includesdetecting a horizontal swipe gesture within the first message regionassociated with a magnitude that is greater than a threshold distance.

In some embodiments, the conversation view includes a toolbar regionincluding a plurality of affordances provided to perform correspondingactions on a most recent message among the plurality of messages.

In some embodiments, a size of the first message region is based atleast in part on an amount of content associated with the first message,and a size of the second message region is based at least in part on anamount of content associated with the second message.

In some embodiments, the processing unit 1308 is further configured toenable display of (e.g., with the display control unit 1310), on thedisplay unit 1302, a list view including a plurality of rowsrepresenting a plurality of conversations in a second pane adjacent tothe first pane that includes the conversation view.

In some embodiments, the processing unit 1308 is further configured todetect (e.g., with the input detecting unit 1312) a second user input,via the one or more input unit 1304, corresponding to the second messageregion within the conversation view. In response to detecting the seconduser input, and in accordance with a determination (e.g., with thedetermining unit 1314) that the second user input satisfies the firstset of input criteria, the processing unit 1308 is further configured toenable display of (e.g., with the display control unit 1310), on thedisplay unit 1302, one or more affordances provided to performcorresponding actions to the second message. In response to detectingthe second user input, and in accordance with a determination (e.g.,with the determining unit 1314) that the second user input satisfies thesecond set of input criteria, the processing unit 1308 is furtherconfigured to replace display of (e.g., with the display control unit1310) the conversation view with a message view that corresponds on thesecond message.

In some embodiments, prior to displaying the conversation view withinthe first pane of the messaging application, the processing unit 1308 isfurther configured to enable display of (e.g., with the display controlunit 1310), on the display unit 1302, a mailbox view that includes aplurality of representations of corresponding to one or more messagesand one or more conversations, where the plurality of representationshave a same size. The processing unit 1308 is further configured todetect (e.g., with the input detecting unit 1312) a second user input,via the input device, that corresponds to selecting a respectiverepresentation from among the plurality of representations. In responseto detecting the second user input selecting the respectiverepresentation, and in accordance with a determination that respectiverepresentation corresponds to a message, the processing unit 1308 isfurther configured to replace display of (e.g., with the display controlunit 1310) the mailbox view with a message view that corresponds to themessage associated with the respective representation. In response todetecting the second user input selecting the respective representation,and in accordance with a determination that respective representationcorresponds to a conversation, the processing unit 1308 is furtherconfigured to replace display of (e.g., with the display control unit1310) the mailbox view with the conversation view that corresponds tothe conversation associated with the respective representation, wherethe conversation includes the plurality of messages.

The operations in the information processing methods described aboveare, optionally implemented by running one or more functional modules ininformation processing apparatus such as general purpose processors(e.g., as described above with respect to FIGS. 1A and 3) or applicationspecific chips.

The operations described above with reference to FIGS. 8A-8C, 9A-9C,10A-10C are, optionally, implemented by components depicted in FIGS.1A-1B or FIGS. 11-13. For example, the detecting operation 816, thedetecting operation 906, and the detecting operation 1010 are,optionally, implemented by event sorter 170, event recognizer 180, andevent handler 190. Event monitor 171 in event sorter 170 detects acontact on touch-sensitive display 112, and event dispatcher module 174delivers the event information to application 136-1. A respective eventrecognizer 180 of application 136-1 compares the event information torespective event definitions 186, and determines whether a first contactat a first location on the touch-sensitive surface (or whether rotationof the device) corresponds to a predefined event or sub-event, such asselection of an object on a user interface, or rotation of the devicefrom one orientation to another. When a respective predefined event orsub-event is detected, event recognizer 180 activates an event handler190 associated with the detection of the event or sub-event. Eventhandler 190 optionally uses or calls data updater 176 or object updater177 to update the application internal state 192. In some embodiments,event handler 190 accesses a respective GUI updater 178 to update whatis displayed by the application. Similarly, it would be clear to aperson having ordinary skill in the art how other processes can beimplemented based on the components depicted in FIGS. 1A-1B.

The foregoing description, for purpose of explanation, has beendescribed with reference to specific embodiments. However, theillustrative discussions above are not intended to be exhaustive or tolimit the invention to the precise forms disclosed. Many modificationsand variations are possible in view of the above teachings. Theembodiments were chosen and described in order to best explain theprinciples of the invention and its practical applications, to therebyenable others skilled in the art to best use the invention and variousdescribed embodiments with various modifications as are suited to theparticular use contemplated.

What is claimed is:
 1. A method comprising: at a device with one or moreprocessors, non-transitory memory, a display, and an input device:displaying, on the display, a conversation view of a plurality ofmessages within a first pane of a messaging application, wherein theconversation view includes a first message region of a portion of afirst message of the plurality of messages and a second message regionof a portion of a second message of the plurality of messages; detectinga user input, via the input device, that corresponds to selecting thefirst message region within the conversation view; and in response todetecting the user input selecting the first message region: inaccordance with a determination that the user input satisfies a firstset of input criteria, displaying, on the display, one or moreaffordances provided to perform corresponding actions on the firstmessage; and in accordance with a determination that the user inputsatisfies a second set of input criteria, replacing display of theconversation view with a message view that corresponds to the firstmessage.
 2. The method of claim 1, wherein displaying the one or moreaffordances includes: in accordance with a determination that the userinput is associated with a first direction: displaying, on the display,a first set of one or more affordances adjacent to a first side of themessage region, wherein the first set of one or more affordances isprovided to perform corresponding actions on the first message; andsliding the first message region in the first direction, wherein atleast a portion of first message region associated with a second side ofthe first message region opposite the first side is occluded.
 3. Themethod of claim 2, further comprising: detecting a subsequent userinput, via the input device, that corresponds to selecting a respectiveaffordance from among the first set of one or more affordances; and inresponse to detecting the subsequent user input selecting the respectiveaffordance, displaying, on the display, one or more options associatedwith the action that corresponds to the respective affordance.
 4. Themethod of claim 1, wherein displaying the one or more affordancesincludes: in accordance with a determination that the user input isassociated with a second direction: displaying, on the display, a secondset of one or more affordances adjacent to a second side of the messageregion, wherein the second set of one or more affordances is provided toperform corresponding actions on the first message; and sliding thefirst message region in the second direction, wherein at least a portionof first message region associated with a first side of the firstmessage region opposite the second side is occluded.
 5. The method ofclaim 2, wherein displaying the one or more affordances includes:maintaining display of the second message region within the conversationview.
 6. The method of claim 1, wherein satisfying the first inputcriteria includes detecting a horizontal swipe gesture within the firstmessage region associated with a magnitude that is less than a thresholddistance.
 7. The method of claim 1, wherein satisfying the first inputcriteria includes detecting a user input that corresponds to selectingan actions affordance within the first message region.
 8. The method ofclaim 1, wherein satisfying the second input criteria includes detectinga user input that corresponds to selecting a header sub-region of thefirst message region.
 9. The method of claim 1, wherein satisfying thesecond input criteria includes detecting a user input that correspondsto selecting a see more affordance within the first message region. 10.The method of claim 1, further comprising: in response to detecting theuser input selecting the first message region: in accordance with adetermination that the user input satisfies a third set of inputcriteria, performing a predefined action on the first message.
 11. Themethod of claim 10, wherein satisfying the third input criteria includesdetecting a horizontal swipe gesture within the first message regionassociated with a magnitude that is greater than a threshold distance.12. The method of claim 1, wherein the conversation view includes atoolbar region including a plurality of affordances provided to performcorresponding actions on a most recent message among the plurality ofmessages.
 13. The method of claim 1, wherein a respective dimension ofthe first message region is based at least in part on an amount ofcontent associated with the first message, and wherein the respectivedimension of the second message region is based at least in part on anamount of content associated with the second message.
 14. The method ofclaim 1, further comprising: displaying, on the display, a list viewincluding a plurality of rows representing a plurality of conversationsin a second pane adjacent to the first pane that includes theconversation view.
 15. The method of claim 1, further comprising:detecting a second user input, via the input device, that corresponds toselecting the second message region within the conversation view; and inresponse to detecting the second user input selecting the second messageregion: in accordance with a determination that the second user inputsatisfies the first set of input criteria, displaying, on the display,one or more affordances provided to perform corresponding actions to thesecond message; and in accordance with a determination that the seconduser input satisfies the second set of input criteria, replacing displayof the conversation view with a message view that corresponds on thesecond message.
 16. The method of claim 1, further comprising: prior todisplaying the conversation view within the first pane of the messagingapplication, displaying, on the display, a mailbox view that includes aplurality of representations of corresponding to one or more messagesand one or more conversations, wherein the plurality of representationshave a same size; and detecting a second user input, via the inputdevice, that corresponds to selecting a respective representation fromamong the plurality of representations; and in response to detecting thesecond user input selecting the respective representation: in accordancewith a determination that respective representation corresponds to amessage, replacing display of the mailbox view with a message view thatcorresponds to the message associated with the respectiverepresentation; and in accordance with a determination that respectiverepresentation corresponds to a conversation, replacing display of themailbox view with the conversation view that corresponds to theconversation associated with the respective representation, wherein theconversation includes the plurality of messages.
 17. A non-transitorycomputer readable storage medium storing one or more programs, the oneor more programs comprising instructions, which, when executed by anelectronic device with a display, and an input device, cause theelectronic device to: display, on the display, a conversation view of aplurality of messages within a first pane of a messaging application,wherein the conversation view includes a first message region of aportion of a first message of the plurality of messages and a secondmessage region of a portion of a second message of the plurality ofmessages; detect a user input, via the input device, that corresponds toselecting the first message region within the conversation view; and inresponse to detecting the user input selecting the first message region:in accordance with a determination that the user input satisfies a firstset of input criteria, display, on the display, one or more affordancesprovided to perform corresponding actions on the first message; and inaccordance with a determination that the user input satisfies a secondset of input criteria, replace display of the conversation view with amessage view that corresponds to the first message.
 18. An electronicdevice comprising: a display; an input device; means for displaying, onthe display, a conversation view of a plurality of messages within afirst pane of a messaging application, wherein the conversation viewincludes a first message region of a portion of a first message of theplurality of messages and a second message region of a portion of asecond message of the plurality of messages; means for detecting a userinput, via the input device, that corresponds to selecting the firstmessage region within the conversation view; means, responsive todetecting the user input selecting the first message region, fordisplaying, on the display, one or more affordances provided to performcorresponding actions on the first message in accordance with adetermination that the user input satisfies a first set of inputcriteria; and means, responsive to detecting the user input selectingthe first message region, for replacing display of the conversation viewwith a message view that corresponds to the first message in accordancewith a determination that the user input satisfies a second set of inputcriteria.
 19. An electronic device comprising: a display unit configuredto display a user interface; one or more input units configured toreceive inputs; and a processing unit coupled with the display unit andthe one or more input units, the processing unit configured to: enabledisplay of, on the display unit, a conversation view of a plurality ofmessages within a first pane of a messaging application, wherein theconversation view includes a first message region of a portion of afirst message of the plurality of messages and a second message regionof a portion of a second message of the plurality of messages; detect auser input, via the one or more input units, that corresponds toselecting the first message region within the conversation view; and inresponse to detecting the user input selecting the first message region:in accordance with a determination that the user input satisfies a firstset of input criteria, enable display of, on the display unit, one ormore affordances provided to perform corresponding actions on the firstmessage; and in accordance with a determination that the user inputsatisfies a second set of input criteria, replace display of theconversation view with a message view that corresponds to the firstmessage.
 20. The electronic device of claim 19, wherein displaying theone or more affordances includes: in accordance with a determinationthat the user input is associated with a first direction: displaying, onthe display, a first set of one or more affordances adjacent to a firstside of the message region, wherein the first set of one or moreaffordances is provided to perform corresponding actions on the firstmessage; and sliding the first message region in the first direction,wherein at least a portion of first message region associated with asecond side of the first message region opposite the first side isoccluded.
 21. The electronic device of claim 20, wherein the processingunit is further configured to: detect a subsequent user input, via theone or more input units, that corresponds to selecting a respectiveaffordance from among the first set of one or more affordances; and inresponse to detecting the subsequent user input selecting the respectiveaffordance, enable display of, on the display unit, one or more optionsassociated with the action that corresponds to the respectiveaffordance.
 22. The electronic device of claim 19, wherein displayingthe one or more affordances includes: in accordance with a determinationthat the user input is associated with a second direction: displaying,on the display, a second set of one or more affordances adjacent to asecond side of the message region, wherein the second set of one or moreaffordances is provided to perform corresponding actions on the firstmessage; and sliding the first message region in the second direction,wherein at least a portion of first message region associated with afirst side of the first message region opposite the second side isoccluded.
 23. The electronic device of claim 20, wherein displaying theone or more affordances includes: maintaining display of the secondmessage region within the conversation view.
 24. The electronic deviceof claim 19, wherein satisfying the first input criteria includesdetecting a horizontal swipe gesture within the first message regionassociated with a magnitude that is less than a threshold distance. 25.The electronic device of claim 19, wherein satisfying the first inputcriteria includes detecting a user input that corresponds to selectingan actions affordance within the first message region.
 26. Theelectronic device of claim 19, wherein satisfying the second inputcriteria includes detecting a user input that corresponds to selecting aheader sub-region of the first message region.
 27. The electronic deviceof claim 19, wherein satisfying the second input criteria includesdetecting a user input that corresponds to selecting a see moreaffordance within the first message region.
 28. The electronic device ofclaim 19, wherein the processing unit is further configured to: inresponse to detecting the user input selecting the first message region:in accordance with a determination that the user input satisfies a thirdset of input criteria, perform a predefined action on the first message.29. The electronic device of claim 28, wherein satisfying the thirdinput criteria includes detecting a horizontal swipe gesture within thefirst message region associated with a magnitude that is greater than athreshold distance.
 30. The electronic device of claim 19, wherein theconversation view includes a toolbar region including a plurality ofaffordances provided to perform corresponding actions on a most recentmessage among the plurality of messages.